React(七)独立组件间的共享Mixins
(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)