推外网络专注营销型网站品牌策划与推广

FOCUS MARKETING WEBSITE BRAND PLANNING AND MARKETING PROMOTION

Vue.js开发心得续

2019-09-28 14:03:50 100000+ 编辑:推外网络 来源:本站原创

在开发webinsights二期产品当中,我们发现了Vue.js的很多强大之处,在此记录为使用心得,也能作为一个小总结为以后的学习沉淀知识。

Vue.js中的路由写起来很有意思,虽然和Angular.js有相似之处,但是更为方便,结构更合理。比如下面代码:

{
path:'/user/seotools',
component:Layout,
redirect:'/user/seotools/index',
name:'seotools',
meta:{
title:'SEO工具',
requireAuth:true
},
children:[
{
path:'index',
component:_import('user/seotools/index')
},
]
}

可以清楚看到,这里的路由是通过children方式引用的,把需要的同一目录都放到children子集中更加合理和清晰,增加了一些逻辑感。

Vue.js的单文件组件是另一个亮点,组件是通过html模板和Vue.js的component来实现,用起来很快捷方便。传统来讲开发中我们会把html视图和js数据控制分到不同的文件来进行管理,这里我们为了方便区分会把他们起成一样的名字,但是使用Vue.js后,我们只需要一个文件就可以了,组件化开发,可以把这个页面写成一个小组件,在需要调用的地方直接import就好了。

例如:

importaddOrmProjectfrom"@/pages/user/seo/componets/addSeoProject.vue";

这样就可以把addOrmProject模块的单页引入到本页做组合使用,是不是感觉很简单呢?

Vue.js还有个亮点就是模块化,他可以组合一些第三方模块构建工具,比如SeaJs、RequireJS、CommonJS,这样就可以轻易实现代码的模块化,在我们开发的项目中,是使用ES6的模块化功能结合Webpack进行相应的打包方案。这也是一个相热门和成熟的方案。

与Angular一样,Vue.js一样有强大的路由功能,通过路由功能,我们可以轻松实现模块的按需加载,节省系统的资源消耗,加快程序的加载速度。

个人认为前端的一些技术都是融会贯通的,学习一门语言或者框架本身并不是为了学习它的技术,最重要的是学习它的思维,只有思维层面得到了延伸,学习其他技术的时候会发现得心应手。Vue.js带给我们的是前端一种解决问题的新的思维。


本站文章均为推外网络摘自权威资料,书籍,或网络原创文章,如有版权纠纷或者违规问题,请即刻联系我们删除,我们欢迎您分享,引用和转载,我们谢绝直接复制和抄袭!感谢...