独立组件间共享Mixins

Mixins:用于组件间事件共享(公用的方法,比如弹窗,数值计算等组件函数)

要使用Mixins,首先要在项目文件夹根目录下安装Mixins包

react>npm install --save  react-mixin@2     //指定安装版本

使用:

step-1  建立公共mixins.js文件,将公共函数放在里面

const MixinLog={
    log(){
       console.log(‘数据打印成功:123...‘)
    }
};

export default MixinLog 

step-2  安装react-mixin包(在ES6下使用,必须安装该插件)

step-3 在使用组件中引入react-mixin及mixins.js

import ReactMixin from ‘react-mixin‘;

import MixinLog from ‘./mixins‘

step-4  在组件中引入mixins.js中定义的方法

ReactMixin(BodyIndex.prototype, MixinLog);

step-5  在函数中写入方法

changeLogin(name){ 

          MixinLog.log();

      }
时间: 05-13

独立组件间共享Mixins的相关文章

React独立组件间通信联动

React是现在主流的高效的前端框架,其官方文档 http://reactjs.cn/react/docs/getting-started.html 在介绍组件间通信时只给出了父子组件间通信的方法,而没有给出独立组件间通信的解决方案.这里我介绍一种不错的实现方式——signals. 第一步,我们要建立两个简单的react组件——一个进度条和一个输入框. 组件——进度条: var ProcessBar=React.createClass({ getInitialState:function(){

十、Vue:Vuex实现data(){}内数据多个组件间共享

一.概述 官方文档:https://vuex.vuejs.org/zh/installation.html 1.1vuex有什么用 Vuex:实现data(){}内数据多个组件间共享一种解决方案(类似react的redux) 1.2什么情况下使用vuex 虽然 Vuex 可以帮助我们管理共享状态,但也附带了更多的概念和框架.这需要对短期和长期效益进行权衡. 如果您不打算开发大型单页应用,使用 Vuex 可能是繁琐冗余的.确实是如此--如果您的应用够简单,您最好不要使用 Vuex.一个简单的 gl

android组件间共享数据的常用方法

使用Intent在激活组件的时候携带数据,以进行数据的传递 使用广播进行组件间数据的伟递 使用外部存储(sharedPreference,文件,数据库,网络)进行组件间数据共享 使用Static静态成员进行数据传递 Application Context进行程序内组件间数据共享

Prism4 文档翻译系列---第3章 管理组件间的依赖关系

基于Prism类库的应用程序可能是由多个松耦合的类型和服务组成的复杂应用程序,他们需要根据用户的动作发出内容和接收通知进行互动,由于他们是松耦合的,他们需要一种方式来互动和交流来传递业务功能的需求. 为了将这些零散的模块组合在一起,基于Prism的应用程序使用了一个依赖注入容器,依赖注入容器通过基于容器的配置提供实例化类对象并且管理它们的声明周期减少了对象之间的依赖耦合关系.在创建对象时,容器将其所需要的依赖全部注入其中.如果这些依赖还没有被创建,容器将会首先创建并解析依赖所需要的对象或者它的依

在 App 扩展和主 App 间共享数据

tags: iOS 8,Swift,App Groups 随着 iOS 8 的发布,苹果为广大开发者很多新的 API,其中最突出显著的就非 App Extension 莫属了.这为开发者们又带来了很多机会. 而我们在开发 App Extension 的时候,基本大多数人都会遇到这样一个问题.就是由于 App Store 的规则是 App Extension 不能独立的发布,而是要跟随一个宿主应用一起发布. 比如奇妙清单: {% img figures /images/extension_1.jp

Android组件间通信框架EventBus

事件总线EventBus模式概述 在不使用事件总线的情况下: 在应用中的多个地方,控件经常需要根据某个状态来更新他们显示的内容.这种场景常见的解决方式就是定义一个接口,需要关注该事件的控件来实现这个接口.然后事件触发的地方来注册/取消注册这些对该事件感兴趣的控件.例如,陌陌依赖手机位置信息来获取附近的用户,所以在位置更新管理器(MmLocationManager)中定义了一个接口来监听位置更新的事件(MmLocationListener): interface MmLocationListene

独立IP与共享IP的区别

做网站选择独立IP还是共享IP,相信很多站长都在此纠结过,自己不使用服务器的时候从来没有关心过独立IP和共享IP的究竟有什么具体的差别.但当自己真正用到的时候,才发现:同样都是 IP,差别不是一般的大,独立IP的强悍,不用的人是没有办法体会的.奉劝亲爱的站友们, 选择IP的时候一定要慎重的考虑好了. 对于大部分网站来说,使用的都是共享IP,我们可以把共享IP理解成,一个房子租给了多个人居住,肯定彼此间有影响和打扰,但是胜在价格便宜.而独立IP的好处就是一个人住,清净.安全.上面的比喻,也就好比是

独立IP与共享IP有什么区别呢?

做网站选择独立IP还是共享IP?相信很多站长都在此纠结过,自己不使用服务器的时候从来没有关心过独立IP和共享IP的究竟有什么具体的差别.但当自己真正用到的时候,才发现:同样都是IP,差别不是一般的大,独立IP的强悍,不用的人是没有办法体会的 做网站选择独立IP还是共享IP?相信很多站长都在此纠结过,自己不使用服务器的时候从来没有关心过独立IP和共享IP的究竟有什么具体的差别.但当自己真正用到的时候,才发现:同样都是IP,差别不是一般的大,独立IP的强悍,不用的人是没有办法体会的.奉劝亲爱的站友们

vue组件间通信六种方式(完整版)

vue组件间通信六种方式(完整版) 前言 组件是 vue.js最强大的功能之一,而组件实例的作用域是相互独立的,这就意味着不同组件之间的数据无法相互引用.一般来说,组件可以有以下几种关系: 如上图所示,A 和 B.B 和 C.B 和 D 都是父子关系,C 和 D 是兄弟关系,A 和 C 是隔代关系(可能隔多代). 针对不同的使用场景,如何选择行之有效的通信方式?这是我们所要探讨的主题.本文总结了vue组件间通信的几种方式,如props.$emit/$on.vuex.$parent / $chil