有没有办法用 React-Native 创建和 dispatch/trigger 自定义事件?
Is there a way to create and dispatch/trigger custom event with React-Native?
使用 DOM,您可以使用 Javascript 轻松创建触发自定义事件,如下所示:
var event = new Event('build');
// Listen for the event.
elem.addEventListener('build', function (e) { /* ... */ }, false);
// Dispatch the event.
elem.dispatchEvent(event);
有没有办法用 React-Native 做到这一点?我知道 NativeEventEmitter 的存在,这是 RN 在 Javascript.
中与本机平台通信的方式
我的情况实际上有两种解决方案:
- https://reactnavigation.org/docs/en/function-after-focusing-screen.html
使用 react-navigation 知道 component/screen 何时收到
使用 'didFocus' 事件侦听器聚焦并触发操作:
import React, { Component } from 'react';
import { View } from 'react-native';
import { withNavigation } from 'react-navigation';
class TabScreen extends Component {
componentDidMount() {
const { navigation } = this.props;
this.focusListener = navigation.addListener('didFocus', () => {
// The screen is focused
// Call any action
});
}
componentWillUnmount() {
// Remove the event listener
this.focusListener.remove();
}
render() {
return <View />;
}
}
export default withNavigation(TabScreen);
- https://redux.js.org/basics/example
使用 Redux 作为您的应用程序的一个全局状态容器。
使用 DOM,您可以使用 Javascript 轻松创建触发自定义事件,如下所示:
var event = new Event('build');
// Listen for the event.
elem.addEventListener('build', function (e) { /* ... */ }, false);
// Dispatch the event.
elem.dispatchEvent(event);
有没有办法用 React-Native 做到这一点?我知道 NativeEventEmitter 的存在,这是 RN 在 Javascript.
中与本机平台通信的方式我的情况实际上有两种解决方案:
- https://reactnavigation.org/docs/en/function-after-focusing-screen.html
使用 react-navigation 知道 component/screen 何时收到 使用 'didFocus' 事件侦听器聚焦并触发操作:
import React, { Component } from 'react';
import { View } from 'react-native';
import { withNavigation } from 'react-navigation';
class TabScreen extends Component {
componentDidMount() {
const { navigation } = this.props;
this.focusListener = navigation.addListener('didFocus', () => {
// The screen is focused
// Call any action
});
}
componentWillUnmount() {
// Remove the event listener
this.focusListener.remove();
}
render() {
return <View />;
}
}
export default withNavigation(TabScreen);
- https://redux.js.org/basics/example
使用 Redux 作为您的应用程序的一个全局状态容器。