vue的mixins混入合并规则

2019-12-06 13:26:30

参考地址 vue的mixins混入功能

混入minxins:分发vue组件中可复用功能的灵活方式。混入对象可以包含任意组件选项。组件使用混入对象时,所有混入对象的选项将混入该组件本身的选项。

选项合并:组件选项和对象选项同名时,将以恰当方式混合。

数据对象:和组件数据冲突时以组件数据优先

同名钩子函数:混合为一个数组,都将被调用,混入对象钩子先调用。

值为对象选项:methods,components,将被混合为同一个对象,两对象键名冲突时,取组件对象的键值对。



混入方式:全局混入,组件混入。 


/**

 * 组件混入封装

 * 实现功能:滚动到指定图表顶部位置

 * @param id 视图id

 * @param topSpace 加载更多组件距离顶部距离

 */

export default {

    methods: {

        scrollToView(id, topSpace) {

            let dom = document.getElementById(id)

            if (dom === null || typeof (dom) === 'undefined') {

                return

            }

            let nodeTop = dom.offsetTop

            let page = document.getElementsByClassName('page-loadmore-wrapper')[0]

            page.scrollTop = nodeTop - topSpace

        }

    }

}



  • 2020-04-14 09:51:03

    package.json 字段说明

    package.json 有很多字段,也有很多官方字段,我们需要知道他们的具体是做什么的才能很好的运用

  • 2020-04-14 15:35:52

    caniuse前端兼容性检查和使用

    相信大家都曾用caniuse网站查询过css、js的一些兼容性问题,并且都从它反馈的兼容性数据中获益,让我们的线上项目更加稳定、和谐的跑在用户电脑里。不过对于caniuse页面上的一些细节,我们可能会感到困惑或者模棱两可,今天就带着大家一起来重新认识caniuse这个网站,并对它的原理和细节做些探究。

  • 2020-04-15 17:00:07

    export和import的理解,这一篇问扎根就够了

    在 ES6 之前,社区制定了一些模块加载方案,最主要的有 CommonJS 和 AMD 两种。前者用于服务器,后者用于浏览器。ES6 在语言标准的层面上,实现了模块功能,而且实现得相当简单,完全可以取代 CommonJS 和 AMD 规范,成为浏览器和服务器通用的模块解决方案。

  • 2020-04-15 21:14:13

    .d.ts与.ts的区别 .d.ts怎么用

    在TypeScript项目中直接引入Javascript包是不能使用的,因为包中缺少TypeScript类型声明,如果是自己写的包,可以考虑自己增加一个.d.ts类型声明文件,如果代码比较多或者使用的是第三方的包,自己写就比较麻烦了。第三方的包首先考虑找一个别人写好的声明文件,如果没有可以使用一些自动生成声明文件的工具。

  • 2020-04-17 09:27:38

    推荐一个老前端开发者的博客

    前端修炼场,首页标签大全greenSock前端研究VUE研究我们的作品flash技术探讨开发心得个人档案培训与招聘服务报价