学习Vue.js的五个小例子

array_huang 发布于2019-08-22 10:35 / 1680人阅读

摘要：前言最近在学习，学着写了几个小例子，自己记录一下，例子都比较简单，希望给初学的小伙伴一些参考。后记文章可能比较简单，只是分享了几个小例子，没有对的用法进行详细说明，大家可以看官方文档。参考资料中文文档五个小案例带你学习火热的

前言

最近在学习vue.js，学着写了几个小例子，自己记录一下，例子都比较简单，希望给初学vue.js的小伙伴一些参考。

双向数据绑定

点击查看

数据绑定是vue.js的基础。本例中就是利用了vue.js的v-model指令在表单元素上创建双向数据绑定。



    {{ message }}

将message绑定到文本框，当更改文本框的值时，

{{ message }}

中的内容也会被更新。

导航切换

点击查看

这里主要应用了vue.js的v-for指令来渲染一个列表、v-bind指令来绑定class以及v-on指令来处理事件

即时搜索

链接描述

这个例子主要应用了vue.js的自定义过滤器，可以通过Vue.filter()注册一个全局过滤器，具体用法可以参考这里，vue.js也提供了一些内置过滤器。

布局转换

链接描述

本例应用了vue.js的v-if指令进行了条件渲染，以及v-bind绑定class和v-on处理事件

合计总价

链接描述

这个例子类似购物车那种选中合计总价的功能，也是对各种指令以及数据绑定的综合应用吧。

后记

文章可能比较简单，只是分享了几个小例子，没有对vue.js的用法进行详细说明，大家可以看官方文档。有时间后面我也会分享更多vue.js的学习笔记。
参考资料
vue.js中文文档
五个小案例带你学习火热的Vue.js

服务器托管私有云深度学习的五个深度入门的五个步骤机器学习例子机器学习的例子

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/90875.html

前端每周清单第 48 期：Slack Webpack 构建优化，CSS 命名规范与用户追踪，Vue.

摘要：发布是由团队开源的，操作接口库，已成为事实上的浏览器操作标准。本周正式发布，为我们带来了，，支持自定义头部与脚部，支持增强，兼容原生协议等特性变化。新特性介绍日前发布了大版本更新，引入了一系列的新特性与提升，本文即是对这些变化进行深入解读。 showImg(https://segmentfault.com/img/remote/1460000012940044); 前端每周清单专注前端...

sean 2019-08-22 13:57 评论0 收藏0
[使用 Weex 和 Vue 开发原生应用] 6 使用 vue-router

摘要：使用值来作路由。原生应用本身就是多页的场景，页面间状态的隔离比共享更重要一些。使用开发的是原生应用，页面栈的管理使用的也是原生的特性，没有但是有模块可以实现页面的前进和后退等操作。系列文章的目录在 ? 这里（由于我比较懒最近一段时间在忙其他事，系列文章拖了好久终于又更新了。。。）什么是 vue-router ？ vue-router 官方文档 vue-router 是针对 V...

leonardofed 2019-08-20 15:51 评论0 收藏0
Laravel Excel 的五个隐藏功能

摘要：文档示例注意你必须通过安装指定的包，比如导出的如下所示按需格式化单元格有一个强有力的爸爸。因此它就拥有其各种底层功能，包括各种方式的单元格格式化。 showImg(https://segmentfault.com/img/remote/1460000018375787?w=1680&h=859); Laravel Excel package 最近发布了 3.0 版本，它所具有的新功能，...

tinna 2019-07-01 12:32 评论0 收藏0
《Java8实战》-第六章读书笔记（用流收集数据-02）

摘要：使用流收集数据分区分区是分组的特殊情况由一个谓词返回一个布尔值的函数作为分类函数，它称分区函数。这种情况下，累加器对象将会直接用作归约过程的最终结果。这也意味着，将累加器不加检查地转换为结果是安全的。使用流收集数据分区分区是分组的特殊情况：由一个谓词（返回一个布尔值的函数）作为分类函数，它称分区函数。分区函数返回一个布尔值，这意味着得到的分组 Map 的键类型是 Boolean ...

jcc 2019-08-19 11:14 评论0 收藏0
信息时代：云计算的五个变化

摘要：云计算的出现是信息技术时代最重大的转变之一，特别是对于企业而言。首先，多样化合作伙伴关系是防止数据丢失或云计算故障时停机的一种方法。有效使用云计算需要制定多云计划，以获得最佳业务成果。对于当今云计算行业发生的重大变化，并没有一种通用的方法。云计算的出现是信息技术时代最重大的转变之一，特别是对于企业而言。但就像天空上变幻不定的云朵一样，云计算技术也在不断变化。企业CEO都应做好充分准备，以最大...

arashicage 2019-04-29 15:46 评论0 收藏0