vue3.0 CLI - 2.5 - 了解组件的三维

 更新时间:2018年09月14日 11:10:17   作者:nDos   我要评论

通过本文带领大家去学习vue3.0 CLI - 2.5 - 了解组件的三维的相关知识,感兴趣的朋友跟随脚本之家小编一起学习吧

我的 github 地址 - vue3.0Study - 阶段学习成果都会建立分支。

问答

1、vue 组件有什么?

为什么要加上 vue,因为不同的 MVC 框架,东西不一样,不过基本的功能都有。

组件有 data、computed、watch、methods 以及生命周期钩子等。对于入门者来说,先搞清楚这些是什么东西。

data 属性经过前面几篇文章的学习,对其已有初步的了解。

computed 是计算属性,前面也有了解。

methods 组件方法,其实是专门定义函数的一个对象,这些函数最终绑定到组件上。

watch 和 生命周期钩子 也不是什么高深的东西!就是个函数而已,别被这些【高大上】的名字给吓着。后面会学习它们。如果了解过 C++ 或 JAVA 的函数重载的概念,那就这么理解这两个东西吧。

2、什么是组件?

组件也不是什么高深的东西。html 标签 div form img 等知道吧,都是【组件】, 只不过呢,vue 里边的组件可以自己命名,也可以定义自己的属性等等,说白了,就是扩展标签。

关于组件,标准实际上已经实现了,叫做【自定义元素】,谷歌为那些没有实现这个标准的浏览器做了个 polyfill,也即是 【polymer】框架:polymer地址,都出到 3.0 版本了,谷歌一直在维护。

3、组件还有什么需要了解的?

组件复用、组件注册、组件组织、组件怎么互相传递数据、组件插槽、动态组件等内容。

组件复用,其实就是搞成一个 html【标签】。它怎么用,传递什么数据给它,它有什么交互功能,怎么显示 ( 前面几篇文章就在介绍这些 ) 都已预定义。

组件注册 和 组件组织,结合起来理解。还是用 html 来理解,div 可以包含 div ( 子元素 );组件也可以包含子组件;html 是如何组织的,组件也是如何组织;注册是怎么回事?vue 中组件要使用其他组件,必须 import 其他组件,这就是注册啦。对!注册和组织,就是这么简单!

注册还有全局注册和局部注册,以后学习慢慢介绍。

传递数据。html 标签之间,无法自己传递数据 ( 当然,有些 css 属性比如 font-size,是单向传递的 )。vue 组件可不一样,父组件不单单可以给子组件传递数据,子组件也可以给父组件传递数据。父 => 子 用 props;子 => 父 用 emit 事件。

插槽。我觉得实际运用过程中,也不一定非要用,以后学习在介绍。

动态组件。比如 nav 导航条,每个导航,可以理解为单个组件,组件复用之后呢,就是导航条。那么怎么知道目前的导航是哪个呢?这就是动态组件的用处。

组件需要了解的东西,简单介绍到这里。

高端一点的东西

上面说的,组件的数据流啊、动态和异步组件啊、访问组件的特殊方式啊、依赖注入啊、强制更新啊等等东西,学习到路由的时候,组件跟路由的纠缠关系啊,还有状态管理系统跟组件的关系等等,就不说那么多东西来吓人,其实这些东西也不是高深的东西,以后我会抽丝剥茧的用形象的方式介绍出来。

好了,以上就是本文的全部内容,希望对大家有所帮助,如果大家有任何疑问欢迎给我留言,小编会及时回复大家的!

相关文章

  • vue-router中scrollBehavior的巧妙用法

    vue-router中scrollBehavior的巧妙用法

    本文给大家介绍vue-router中scrollBehavior的妙用,文中给大家提到了两种解决方案,需要的朋友可以参考下
    2018-07-07
  • vue select二级联动第二级默认选中第一个option值的实例

    vue select二级联动第二级默认选中第一个option值的实例

    下面小编就为大家分享一篇vue select二级联动第二级默认选中第一个option值的实例,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
    2018-01-01
  • 对vue里函数的调用顺序介绍

    对vue里函数的调用顺序介绍

    下面小编就为大家分享一篇对vue里函数的调用顺序介绍,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
    2018-03-03
  • web前端vue之CSS过渡效果示例

    web前端vue之CSS过渡效果示例

    本篇文章主要介绍了web前端vue之CSS过渡效果示例,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2018-01-01
  • 详解vue之页面缓存问题(基于2.0)

    详解vue之页面缓存问题(基于2.0)

    本篇文章主要介绍了vue之页面缓存问题(基于2.0),小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2017-01-01
  • 利用VUE框架,实现列表分页功能示例代码

    利用VUE框架,实现列表分页功能示例代码

    本篇文章主要介绍了利用VUE框架,实现列表分页功能,具有一定的参考价值,感兴趣的小伙伴们可以参考一下。
    2017-01-01
  • 基于 Vue 的树形选择组件的示例代码

    基于 Vue 的树形选择组件的示例代码

    本篇文章主要介绍了基于 Vue 的树形选择组件的示例代码,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2017-08-08
  • Vuex 入门教程

    Vuex 入门教程

    这篇文章主要介绍了Vuex 入门教程,Vuex 是一个专为 Vue.js 应用程序开发的状态管理模式, 那这个 vuex 怎么用呢?就具体来看一下吧
    2018-01-01
  • 详解vue 模版组件的三种用法

    详解vue 模版组件的三种用法

    本篇文章主要介绍了详解vue 模版组件的三种用法,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2017-07-07
  • 如何使用Vuex+Vue.js构建单页应用

    如何使用Vuex+Vue.js构建单页应用

    这篇文章主要教大家如何使用Vuex+Vue.js构建单页应用,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2016-10-10

最新评论