如何讓 TextInput 在 Android 中顯示輸入文本的開頭而不是結尾？

Question

我的 react-native 應用程序中有一個TextInput 。 當我設置值 prop 並且值比TextInput的長度長時，它顯示從末尾而不是開頭的文本。 在 iOS 中它工作正常，這似乎是一個 Android 問題。 有沒有辦法將文本從TextInput的開頭或首選顯示對齊？

這是我看到的：

這就是我想要的：

這是我的代碼

<TextInput
defaultValue={address}
ref="searchInput"
autoCorrect={false}
style={searchStyles.searchInputField}
placeholderTextColor={'#ddd'}
placeholder="Location"
onChangeText={query => this.search(query)}
/>

Answer 1

我遇到了同樣的問題，我的解決方案是默認將選擇道具添加到開始。 這是有效的，因此當輸入聚焦時，它會進入開始。 然后我添加了autoFocus道具並將其設置為 true 以使其在加載組件時進入開始狀態。

<TextInput value={address} autoFocus={true} selection={{start:0, end:0}} />

可能有更好的方法來做到這一點，但這是我提出的希望它可以幫助其他人。

Answer 2

添加selection={{start:0}}不帶end屬性

Answer 3

試試這個對我有用

constructor(props) {
 super(props);
 
 this.state = {
   selection: Platform.OS === 'android' ? { start: 0 } : null
 }
}

onFocus =()=>{
  if(Platform.OS==='android'){
    this.setState({ selection:null });
  }
}

onBlur =()=>{
  if(Platform.OS==='android'){
    this.setState({ selection:{ start: 0, end: 0 } });
  }
}

<TextInput
  onFocus={()=>this.onFocus()}
  onBlur={()=>this.onBlur()}
  selection={this.state.selection}
/>

Answer 4

this.inputRef &&
        this.inputRef.setNativeProps({ selection: { start: 0, end: 0 } })

將代碼放在 onEndEditing 中以及您想要更新文本的任何位置。

或者同時更新文本和選擇：

this.inputRef &&
        this.inputRef.setNativeProps({ text: value, selection: { start: 0, end: 0 } })

Answer 5

ellipsizeMode="head"或者你可以試試ellipsizeMode="tail"