Vue.js 2.0 计算属性

Vue3.0和Vue2.0的区别1默认进行懒观察（lazy observation）。在 2.x 版本里，不管数据多大，都会在一开始就为其创建观察者。当数据很大时，这可能会在页面载入时造成明显的性能压力。3.x 版本，只会对「被用于渲染初始可见部分的数据」创建观察者，而且 3.x 的观察者更高效。2更精准的变更通知。比例来说：2.x 版本中，使用 Vue.set 来给对象新增一个属性时，这个对象的所有 watcher 都会重新运行；3.x 版本中，只有依赖那个属性的 watcher 才会重新运行。3.0 新加入了 TypeScript 以及 PWA 的支持3部分命令发生了变化：下载安装 npm install -g vue@cli删除了vue list创建项目 vue create启动项目 npm run serve4默认项目目录结构也发生了变化：移除了配置文件目录，config 和 build 文件夹移除了 static 文件夹，新增 public 文件夹，并且 index.html 移动到 public 中在 src 文件夹中新增了 views 文件夹，用于分类 视图组件 和 公共组件

应该蛮多人用了，今年才发布，但是用户量已经很多了

Vue 和 Angular 我都使用过，并分别用这两个框架开发过网站，目前仍然在上线运行。这里首先需要澄清一下我下面的论述：关于Vue.js，指的是 2.0+，关于 Angular，指的是 2.0 ~ 8.0Vuevue在国内很火，很多大大小小的公司开发前端应用都在使用它。因为作者尤雨溪同志在设计之初就将vue设定为简单易学，快速上手，学习曲线平缓。所以深受广大前端开发者的喜爱。它是一个渐进式的框架，通俗讲就是用它开发Web App，一开始很小，随着开发的进行，功能的增加，你的项目复杂度会慢慢的增加。所以vue很适合小型的前端应用，小型的前端应用结构简单，功能较少。但是，一旦你要给你的项目里添加更多的功能，vue就会要求你再去安装其他的包，比如路由包 vue-router，比如 HTTP API 的前端 axios（用这个访问后端服务器的 API, 来向后端传递数据或者访问后端服务器来获得数据）。这个过程就是“渐进”。再说说 vue 的语法。在它的控制模块 controller，语法还是比较简洁的，2.0 版本采用的还是 Javascript 语法，去年 11 月发布的 3.0 则采用的是 TypeScript。在它的视图模块 View，则是将一些语法与HTML相结合，动态的生成最终的 html 代码。例如{{ title }}在你的 JS 代码中定义好这个 title 变量，并赋值，那么在最终的HTML代码中这个花括号和title位置就会被变量title的实际的值替换掉。另外，在使用 vue 开发的时候，每一个 *.vue 文件都是一个模型 model，在模型中，会包含 HTML代码，CSS代码，JS 代码。这样的设计就非常的紧凑，项目文件的数量会比较少。但是你写的代码多了之后，一个vue文件就会很长，我个人非常痛苦，要不断的拖拽窗口，拨动鼠标滚轮，哈哈。好了，vue就先说到这里，接下来讲一讲 AngularAngularAngular（简称 ng） 最早是由Google公司内部的一个工程师开发的，早期的 1.0 版本的语法非常繁琐，很难写，我个人学习前端框架，其实就是从 angular 1.0 开始的，吐了很多次血。到了 2.0 以后，ng 的架构就彻底的面向了 MVC（model-view-controller），将视图、控制器、模型彻底分离，可以单独开发。ng 的最大特点就是高度集成，你在开发项目的时候，对于 API 访问、异步操作等前端常见的功能，ng都已经有了内置的包，只需要依赖注入就可以了。比如import { HttpClient, Http } from "angular/core"ng 从 2.0 开始，就直接要求使用 TypeScript 语言（微软出品，可以看作是OOP风格的JS，很好用，很规范）。每一个ng模块，都基本上由三个文件组成，*.html, *.js, *.css。在ng的视图文件中（html），采用的是数据双向绑定，例如：这个title变量是与 js 文件中的 title变量双向绑定的，无论在页面的输入框里修改title，还是通过 js 程序修改 title，都会改变这个变量 title 的值，你看到的效果就是输入框里的内容变化了。Angular的学习曲线比较陡峭，国内用的很少。但是我曾经和美国的哥们一起开发过 Web App，他们张口就是采用 Angular 4.0+。正好我也没怯场。ng在国外用的比较多，适合多人协作开发规模较大的项目。补充我经常和我的学生交流，他们说去了一些培训机构打听后，前端课程里也有vue，也有angular。但是我发现教授的angular都是 angular.js，这样写就表示 angular 1.0。现在已经过时了。所以如果你提问的目的是要去自学或者加入培训机构，请擦亮眼睛，不要浪费时间。如果你提问的目的是要去求职，从事前端开发的工作，那么在国内，没办法，Vue 你必须掌握，Angular 可以不去理会。另外，不要忘了目前前端框架江湖的三分天下局势，道上还有另外一个框架，就是Facebook出品的，同样出名的 React，有兴趣和精力了，也可以去了解一下。最后，回到你的问题，哪个简单易学？ 是 Vue。哪个好 ？我个人认为它们不相上下，都是生产环境下可靠的框架，都不会让你失望。

Vue父组件向子组件传递事件/调用事件 不是传递数据（props）哦，适用于 Vue 2.0 方法一：子组件监听父组件发送的方法 方法二：父组件调用子组件方法 子组件： export default { mounted: function () { this.$nextTick(function () { this.$on('childMethod', function () { console.log('监听成功') }) }) }， methods { callMethod () { console.log('调用成功') } } }父组件： export default { methods: { click () { this.$refs.child.$emit('childMethod') // 方法1 this.$refs.child.callMethod() // 方法2 }, components: { child: child } }以上这篇Vue父组件调用子组件事件方法就是小编分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持脚本之家。 您可能感兴趣的文章:VUEJS 2.0 子组件访问/调用父组件的实例vue.js中父组件调用子组件的内部方法示例ES6下子组件调用父组件的方法(推荐)