反應本機多行，值，小於TextInput組件中的占位符

Question

將multiline設置為false的<TextInput>組件中添加文本時， value文本與placeholder文本字體大小匹配，而如果multiline等於true ，則value文本字體大小小於placeholder字體大小。

這是正常行為還是錯誤？

編輯：

/* @flow */

import React from 'react'
import Separator from './components/Separator'
import {Button, StyleSheet, TextInput, View} from 'react-native'

const styles = StyleSheet.create({
    subject: {
        height: 20,
    },
    body: {
        height: 100,
    },
})

export default class NewQuestion extends React.Component {
    static navigationOptions = ({navigation}) => ({
        title: 'AIBU',
        headerLeft: (
            <Button
                onPress={() => {
                    navigation.goBack()
                }}
                title="Back"
            />
        ),
    })

    state = {
        subject: '',
        body: '',
    }

    render() {
        return (
            <View>
                <TextInput
                    autoFocus
                    onChangeText={subject => this.setState({subject})}
                    placeholder="Enter your AIBU subject..."
                    style={styles.subject}
                    value={this.state.subject}
                />
                <Separator />
                <TextInput
                    multiline
                    onChangeText={body => this.setState({body})}
                    placeholder="Enter your AIBU description..."
                    style={styles.body}
                    value={this.state.body}
                />
            </View>
        )
    }
}

Answer 1

據我所知，多行和非多行TextInput -s的默認字體大小實際上是不同的。 解決此問題的一種方法是通過引入另一個充當TextInput之上的抽象的TextInput ：

 const styles = StyleSheet.create({ text: { fontFamily: 'System', fontStyle: 'normal', fontSize: 20, lineHeight: 20, letterSpacing: 0.6 } }) export default class AppTextInput extends Component { static propTypes = { style: TextInput.propTypes.style } static defaultProps = { style: {} } render() { return ( <TextInput {...this.props} style={[ styles.text, this.props.style ]} /> ) } } 

現在，您可以AppTextInput假定使用TextInput一樣使用AppTextInput ，並且與樣式輸入有關的所有問題都可以在一個地方找到。