1.4.17 • Published 5 years ago
react.eval v1.4.17
react.eval
React 组件间通信(调用指定id的react组件实例)
我们都知道 document.getElementById('app') 可以用来获得 id 为 app 的dom元素 <div id="app"></div>
在react环境下,本组件提供获得指定id的react组件实例功能 <Toast id="toast" />
github(仓库和教程地址) https://github.com/sunluna/react.eval
使用本组件需要安装 babel-plugin-transform-decorators-legacy
(https://github.com/loganfsmyth/babel-plugin-transform-decorators-legacy#readme)
webpack1.x 配置=> webpack.config.js
...
module:{
loaders:[
{
test:/.js[x]?$/,
exclude: /node_modules/,
loader:'babel-loader',
query:{
presets:['es2015','react','stage-0'],
plugins:['transform-runtime','transform-decorators-legacy']
}
}
]
}
快速开始:
1、注册组件
import React from 'react';
import { ref } from 'react.eval';
@ref
class Toast extends React.Component {
constructor(props) {
super(props);
this.state={
show:false,
};
}
show=()=>{
this.setState({
show:true,
});
}
render() {
const { show } = this.state;
return show && (
<div>Hello world!!!</div>
);
}
}
export default Toast;
2、引用组件
...
<HomePage/>
<Toast id="toast" />
...
3、任意位置调用组件实例
import { refs } from 'react.eval';
...
somewhere(){
refs.toast.show();
}
...
1.4.17
5 years ago
1.4.16
5 years ago
1.4.15
5 years ago
1.4.14
6 years ago
1.4.13
6 years ago
1.4.12
6 years ago
1.4.11
6 years ago
1.4.11-alpha2
6 years ago
1.4.11-alpha1
6 years ago
1.4.11-alpha0
6 years ago
1.4.10
6 years ago
1.4.9
6 years ago
1.4.8
6 years ago
1.4.7
6 years ago
1.4.6
6 years ago
1.4.5
6 years ago
1.4.4
6 years ago
1.4.2
6 years ago
1.4.1
6 years ago
1.4.0
6 years ago
1.3.4
6 years ago
1.3.3
6 years ago
1.3.2
6 years ago
1.3.1
6 years ago
1.3.0
6 years ago
1.2.5
6 years ago
1.2.4
6 years ago
1.2.3
6 years ago
1.2.2
6 years ago
1.2.0
6 years ago
1.1.2
6 years ago
1.1.1
6 years ago
1.1.0
6 years ago
1.0.10
6 years ago
1.0.9
6 years ago
1.0.8
6 years ago
1.0.7
6 years ago
1.0.6
6 years ago
1.0.5
6 years ago
1.0.4
6 years ago
1.0.3
6 years ago
1.0.2
6 years ago
1.0.1
6 years ago
1.0.0
6 years ago