(1)ES6的使用 (https://github.com/brigand/react-mixin

  下载依赖包

npm i react-mixin --save

(2)导入react-mixin包

import ReactMixin from 'react-mixin'

(3)创建js文件 MixinLog.js

const MixinLog = {
log(){
console.log('111')
}
}; export default MixinLog;

(4)使用MixinLog

import React, { Component } from 'react';
import logo from './logo.svg';
import './App.css';
import ReactMixin from 'react-mixin';
import MixinLog from './components/MixinLog'; class App extends Component {
constructor(props) {
super(props);
this.state = {date: new Date()};
}
  handle() {
Mixin.log();
}
  render() {
return (
<div className="App">
<header className="App-header">
<img src={logo} className="App-logo" alt="logo" />
<h1 className="App-title">Welcome to React</h1>
</header>
<p>{this.state.date.toLocaleTimeString()}</p>
</div>
);
}
} ReactMixin(App.prototype, MixinLog)

React(七)独立组件间的共享Mixins的更多相关文章

  1. React独立组件间通信联动

    React是现在主流的高效的前端框架,其官方文档 http://reactjs.cn/react/docs/getting-started.html 在介绍组件间通信时只给出了父子组件间通信的方法,而 ...

  2. React中父子组件间的通信问题

    1.https://blog.csdn.net/sinat_17775997/article/details/59103173 (React中父子组件间的通信问题)

  3. React数据流和组件间的沟通总结

    今天来给大家总结下React的单向数据流与组件间的沟通. 首先,我认为使用React的最大好处在于:功能组件化,遵守前端可维护的原则. 先介绍单向数据流吧. React单向数据流: React是单向数 ...

  4. React数据流和组件间的通信总结

    今天来给大家总结下React的单向数据流与组件间的沟通. 首先,我认为使用React的最大好处在于:功能组件化,遵守前端可维护的原则. 先介绍单向数据流吧. React单向数据流: React是单向数 ...

  5. React和Vue组件间数据传递demo

    一.React (一)父组件向子组件传数据 简单的向下传递参数 /* Parent */ class App extends Component { render() { return ( <d ...

  6. 五、react中父子组件间如何传值

    1.父组件向子组件传递数据:父组件绑定属性值传给子组件,子组件通过this.props()接受. 2.子组件向父组件传递数据:子组件绑定一个方法,方法中通过this.props.父组件方法名(参数)传 ...

  7. React 精要面试题讲解(二) 组件间通信详解

    单向数据流与组件间通信 上文我们已经讲述过,react 单向数据流的原理和简单模拟实现.结合上文中的代码,我们来进行这节面试题的讲解: react中的组件间通信. 那么,首先我们把看上文中的原生js代 ...

  8. React中组件间通信的方式

    React中组件间通信的方式 React中组件间通信包括父子组件.兄弟组件.隔代组件.非嵌套组件之间通信. Props props适用于父子组件的通信,props以单向数据流的形式可以很好的完成父子组 ...

  9. react组件间的传值方法

    关于react的几个网站: http://react.css88.com/ 小书:http://huziketang.mangojuice.top/books/react/ http://www.re ...

随机推荐

  1. VMware 虚拟机运行卡慢的解决办法

    虚拟机的运行速度有一部分原因决定于你的物理机的配置,如果你的物理机配置不高,建议不要运行虚拟机,那样反而会更卡! 切记!!!在操作之前,先给虚拟机拍摄一个快照,然后所有操作都在虚拟机关机的情况下执行! ...

  2. [Android] Android GreenDao 保存 JavaBean 或者List <JavaBean>类型数据

    Android GreenDao 保存 JavaBean 或者List <JavaBean>类型数据 简介 数据库存储数据基本上每个APP都有用到,GreenDAO 是一个将对象映射到 S ...

  3. Pandas时间处理的一些小方法

    一.以下有两种方式可以创建一个Timestamp对象: 1. Timestamp()的构造方法 import pandas as pd from datetime import datetime as ...

  4. 2.9 while循环

    while循环 <1>while循环的格式 while 条件: 条件满足时,做的事情1 条件满足时,做的事情2 条件满足时,做的事情3 ...(省略)... demo i = 0 whil ...

  5. 拆系数FFT及其部分优化

    模拟考某题一开始由于校内OJ太慢直接拆系数FFT跑不过 后来被神仙婊了一顿之后发现复杂度写炸了改了改随便过 模版题:任意模数NTT 三模数NTT 常数巨大,跑的极慢 拆系数FFT 原理是对于两个多项式 ...

  6. java.util.zip.ZipException: invalid entry size

    启动maven项目时报java.util.zip.ZipException: invalid entry size (expected 7612 but got 5955 bytes) 可能是mave ...

  7. jdk生成https证书

    最近由于客户现场做“等保”,其中有一条要求我们必须使用https进行web端的请求,之前我们一直沿用的是默认的http请求,用户说不安全,唉~~局域网,一直强调安全,安全,话不多说了 我采用的使用JA ...

  8. keepalived健康检查方式【转】

    keepalived具有很强大.灵活的后端检测方式,其具有HTTP_GET|SSL_GET|TCP_CHECK|SMTP_CHECK|MISC_CHECK 几种健康检测方式 ,在分别介绍各种检测方式之 ...

  9. C++的一些小Tip

    string转数字: 一种是转换为char*后再使用atoi:atoi(s.c_str()).这个方法的神奇之处在于,如果s是负数也能顺利转化,但是,在leetcode显示,自己先判断是不是负数的话计 ...

  10. Easyui datalist 使用记录

    仅简单记录下,资料相对比较少 官方给了一个很简单的例子,没啥用处,文档:http://www.jeasyui.com/documentation/datalist.php 学习要点: 1.追加行 $( ...