4

我正在尝试让 onPress 工作，但没有打印“hi”。实际上，单击文本时应显示在文本后面的灰色默认背景并未显示。如果我用 TouchableHighlight 组件替换嵌套文本，它会打印。但是，这需要是一个连续的文本流，并且会换行到下一行，因此 TouchableHighlight 将不适合。

<Text>   
    <Text>Thanks for visiting the app! Please click </Text>
    <Text onPress={() => { console.log("hi") }}> here right now! </Text>
    <Text>to sign in</Text>
</Text>

实际的代码比上面的代码稍微复杂一些，但它基本上是几个文本组件嵌套在一个更大的文本组件中（这样文本可以换行到下一行，看起来像一段文本）。关于如何让文本组件工作的 onPress 的任何想法？谢谢！

它应该是什么样子（粗体文本代表可点击的内容）：

请 立即点击此处
登录。

它不应该是什么样子（不能使用 View 作为外部持有者而不是文本）：

Please click here right to sign in. 
             now
4

2 回答 2

0

原来我的解决方案是清理和重建项目....

于 2020-04-21T18:12:08.883 回答
0

我有一个类似的问题，我在 View 中使用了Text和 TouchableOpacitywrapper的组合，flexWrap : wrap查看演示

这是代码：


const test = () => {
  return ( 
    <View style={styles.container}>
      <Text style={styles.textPart1}>
      test you text {' '}
      </Text>
      <TouchableOpacity>
        <Text style={styles.textPart2}>
       clickable text
        </Text>
        </TouchableOpacity>    
    </View>
  );
};

const styles = StyleSheet.create({
  container: {
    flex: 1,
    flexDirection:'row',
    flexWrap:'wrap',
    justifyContent: 'center',
    alignContent: 'center',
    padding: 10,
  },
  textPart1: {
    fontFamily: 'Raleway-Regular',
    fontSize: 20,
    color: '#5F5F5F',
  },
  textPart2: {
    fontFamily: 'Raleway-Regular',
    fontSize: 20,
    color: '#428947',
    textDecorationLine: 'underline',
  },
});
于 2020-04-21T17:27:11.587 回答