我Submit()
在一个具有名称的组件中创建了一个函数,formSignup.js
并创建了另一个名称buttonSubmit.js
包含Button(onPress)的组件,该按钮具有要调用的Submit()
函数f ormSignup.js
。
为Submit按钮创建单独的组件的原因是,我编写了很多动画代码,并且我想在中重新使用该Button loginComponent.js
。
formSignup.js
submit = () => {
...
}
buttonSubmit.js
How can i call submit function from fromSignup.js here
_onPress() {
if (this.state.isLoading ) return;
this.setState({isLoading: true});
Animated.timing(this.buttonAnimated, {
toValue: 1,
duration: 200,
easing: Easing.linear,
}).start();
setTimeout(() => {
this._onGrow();
}, 2000);
setTimeout(() => {
Actions.mainScreen();
this.setState({isLoading: false});
this.buttonAnimated.setValue(0);
this.growAnimated.setValue(0);
}, 2300);
}
-----
return(
<TouchableOpacity
onPress={this._onPress}
activeOpacity={1}>
{this.state.isLoading ? (
<Image source={spinner} style={styles.image} />
) : (
<Text style={styles.text}>Go</Text>
)}
</TouchableOpacity>
);
就您而言,我对此表示怀疑。
您是否在formSignup.js组件内使用buttonSubmit.js组件?
如果是,您可以通过将函数作为道具来实现。
//FormSignup.js
const FormSignup = () =>{
const submit = () => {
// some submit logic
};
//render
return (
<View>
....
// if you are using the ButtonSubmit component in FormSignup.js, you
// can get function by props
<ButtonSubmit onPressButton = {()=>submit()}/>
</View>
)
}
//ButtonSubmit.js
const ButtonSubmit = (props) => {
return (
<TouchableOpacity onPress={props.onPressButton}>
<Text>submit</Text>
</TouchableOpacity>
)
}
如果否,则应单独编写该函数,然后将其导入ButtonSubmit.js组件中。
// Utility.js
const submit = () => {
// submit logic
};
export {submit};
//================================//
//ButtonSubmit.js
import { submit } from './path/Utility.js' // import the submit method
const ButtonSubmit = () => {
return (
<TouchableOpacity onPress={()=>submit()}>
<Text>submit</Text>
</TouchableOpacity>
)
}
本文收集自互联网,转载请注明来源。
如有侵权,请联系[email protected] 删除。
我来说两句