React（七）独立组件间的共享Mixins

• Z时代
• 2024-01-10
• 分类：综合

（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 的全部内容， 来源链接： utcz.com/z/381792.html