mixin.js的应用（vue）

在项目开发中可以把一些复用的逻辑单独提取出来，放在js文件中，在用到的文件中引入。

1、应用场景：

不同省份计算电量电价的单位和保留几位小数点的规则不同，如何简洁的在不同页面中根据登录省份展示对应的单位等

2、解决方案：

1）创建js文件用于混入

export default {
    data() {
        return {
            shengfenCode: '', //省份
            shengfenObj: {
                'hebei': {
                    danwei: '千瓦时',
                },
                'henan': {
                    danwei: '兆瓦时',
                },
            },
            danwei: '',
        }
    },
    created() {
        this.shengfenCode = .... //通过缓存或者vuex获取省份
        this.danwei = this.shengfenObj[this.shengfenCode.danwei]
    }

}

2)需要使用的组件中引入js文件

<script>
import mixin from '../mixin.js';
export deffault {
    mixins: [mixin],
    mounted(): {
        console.log('电价单位：' + this.danwei)
    },
}
</script>