如何在react native中实现“e.目标.价值”

ikfrs5lh  于 2023-03-03  发布在  React
关注(0)|答案(5)|浏览(176)

我想在react native中访问按钮值,在纯javascript中它看起来像:

const checkingStuff = (e) => console.log(e.target.value)

<button onclick={checkingStuff} > this is the value </button>.

如何在react native中实现同样的效果?
编辑:请用react native回答,而不是react js,因为

<Button
onPress={checkingStuff}
title='lalala123'/>

给予我“未定义”。

h4cxqtbf

h4cxqtbf1#

我不知道你想达到什么目的,但是你应该直接在input中访问事件,而不是在button中。对于React Native中的TextInput,更改后的文本作为一个字符串参数传递给回调处理程序。
你可以试试这个

const [text, onChangeText] = useState("")
const onPress = () => {
   console.log(text)
}

return (
    <>
        <TextInput value={text} onChangeText={onChangeText}>
        <Button onPress={onPress}/>
    </>
)
mklgxw1f

mklgxw1f2#

如果您从react-native导入Button,这可能是一个适合您的解决方案

<Button title='here is your button text' onPress={(e)=>console.log(e._dispatchInstances.memoizedProps.children[0].props.children)}/>

但是如果你从其他来源导入按钮,或者如果这不能带来确切的值,那么你可以去e._dispatchInstances.memoizedProps.children然后检查你的按钮文本项的位置,并获得它在你自己的方式。

j8yoct9x

j8yoct9x3#

event handlers通过函数给予对event的固有访问。除非在DOM中特别设置状态,否则不需要执行内联箭头函数。您可以简单地引用该函数,如下所示:

const checkingStuff = (e) => { console.log(e.target.value) }

<button onClick={checkingStuff} > Set state and add your {value} like so </button>
xxls0lw8

xxls0lw84#

我主要使用以下方法:
1.在TextInput本身中。

<TextInput
 style={{ height: 40, borderColor: 'gray', borderWidth: 1 }}
 onChangeText={text => console.log(text);
 value={value}
 />

1.如果在react-native中使用类。

<TextInput style = {styles.input}
        underlineColorAndroid = "transparent"
        placeholder = "Password"
        placeholderTextColor = "#9a73ef"
        autoCapitalize = "none"
        onChangeText = {this.handlePassword}/>

这个.handlePassword是:

handlePassword = (text) => {
  this.setState({ password: text })
 }

如果您使用的是功能组件:

const [text, onChangeText] = React.useState("");
<TextInput
    style={styles.input}
    onChangeText={onChangeText}
    value={text}
  />
jm2pwxwz

jm2pwxwz5#

你可以得到这样的:

const checkingStuff = (e) => console.log(e.target.value)

<button onclick={(e) => checkingStuff(e)} > this is the value </button>

相关问题