Question

图标必须在右侧。

这是一个新组件

<View style={{ borderBottomWidth: 0.4, borderBottomColor: '#858585' }}>
        <TouchableOpacity
          style={Style.suggestionView}
          onPress={() => {
            this.props.UserStore.addRecentSearch(item[this.props.text_key])
            this.props.NavigationStore.navigate({ routeName: 'ProductInfo', params: { item } })
            this.autoCompleteTimeout = setTimeout(() => {
              if (mounted) this.setState({ showAutoComplete: false })
            }, 400)
          }}
        >
          <Text style={{ marginLeft: 20, textAlign: 'left', color: '#9B999A', fontFamily: 'Poppins-bold' }}>{suggestion}</Text>
          <Icon name='chevron-right' size={20} style={{ color: 'grey' }} />
        </TouchableOpacity>
      </View>

我希望输出会在右侧显示图标。

Answer 1

将您的代码更改为以下代码：

<View style={{ borderBottomWidth: 0.4, borderBottomColor: '#858585' }}>
            <TouchableOpacity
              style={Style.suggestionView}
              onPress={() => {
                this.props.UserStore.addRecentSearch(item[this.props.text_key])
                this.props.NavigationStore.navigate({ routeName: 'ProductInfo', params: { item } })
                this.autoCompleteTimeout = setTimeout(() => {
                  if (mounted) this.setState({ showAutoComplete: false })
                }, 400)
              }}
            >
              <Text style={{ marginLeft: 20, textAlign: 'left', color: '#9B999A', fontFamily: 'Poppins-bold' }}>{suggestion}</Text>
            <View style={{ justifyContent: 'center', alignItems: 'flex-end' }}>
              <Icon name='chevron-right' size={20} style={{ color: 'grey' }} />
            </View>
            </TouchableOpacity>
          </View>

如何修复图标在右侧？

1 个答案: