0.0.3 • Published 5 years ago

bindmodel v0.0.3

Weekly downloads
1
License
ISC
Repository
-
Last release
5 years ago

react 数据绑定props插件,兼容子父多个路由绑定props。

插件依赖于 dva 安装dva

npm i dva -S

如何使用?

在任何页面使用 this.$bind(key,value) 就可以绑定到this.props.bindModel;

在入口index文件配置

import React from 'react'; 
import dva from 'dva';
const app = dva();

//引入插件,返回model 和 bind 绑定函数
import {model,bind} from 'bindmodel';


//修改model名称 默认bindModel,此步可以忽略。
model.namespace ='bindModel';
//注册 dva model;
app.model(model);
//挂载全局函数
React.Component.prototype.$bind = bind;

在路由页面(bindModel 就是 注册model名字)

import React from 'react';
import { connect } from 'dva';
@connect(({ bindModel }) => ({ bindModel }))
export default class IndexPage extends React.Component {
  constructor (props) {
    super(props);
    this.state = {
    }
  }
  bindFun(){
    this.$bind('type','123');
  }
  async getdata(){
    //接口数据绑定案例
    const p = await request('api/xxxxx');
    p.then((res)=>{
      this.$bind('list',res.data);
    })
  }
  render(){
    const { list,type } =this.props.bindModel;
    return (
      <div >
        <h1 onClick={this.bindFun.bind(this)}>
          你好我是绑定的值: {type}
        </h1>
        {
          list && list.map((item,index)=>{
            return (<div key={index}>{item}</div>)
          })
        }
      </div>
    );
  }
};
0.0.3

5 years ago

0.0.2

5 years ago

1.0.2

5 years ago

1.0.1

5 years ago

1.0.0

5 years ago