资讯专栏INFORMATION COLUMN

学习Vue.js-Day2

Zhuxy / 377人阅读

书接上文/思考反馈

react,ng,vue作用差不多,那各个都有什么特点啊,实际工作中应该用哪一个?

答:其实在实际工作中,组员会通过讨论而选择框架;这三个框架都能解放你的工作量,也适合做单页面应用
【今天又是努力的一天】

案例:品牌管理案例

结合第一天所学知识,做案例;螺旋式提升开发能力

案例要点:

添加新品牌

删除品牌

筛选品牌

主体分成两大部分,先编写主体代码,再做添加。
分为1,添加信息区域 2,展示信息区域
添加信息区域代码如下,大致 包括 三个输入框,以及一个添加按钮

添加品牌

信息展现区域,包括Id,Name,Time等信息的展示

Id Name Ctime Operation
{{ item.id }} {{ item.ctime | dateFormat() }} 删除
完成以上步骤之后,请认真阅读下面知识点及步骤。

通过使用 过滤器,可以达到 重写时间的作用,比如 "2018-09-02T12:58:41.347Z",可以变为 2018-9-2 21:19:6

过滤器

概念:Vue.js 允许你自定义过滤器,可被用作一些常见的文本格式化。过滤器可以用在两个地方:mustache 插值和 v-bind 表达式。过滤器应该被添加在 JavaScript 表达式的尾部,由“管道”符指示;

1. 过滤器的定义

    // 过滤器的定义语法
     Vue.filter("过滤器的名称", function(){})

    // 过滤器中的 function ,第一个参数,已经被规定死了,永远都是 过滤器 管道符前面 传递过来的数据
    /* Vue.filter("过滤器的名称", function (data) {
      return data + "123"
    }) */

以下例子,当句子中存在“单纯”自动换成其他

  
  

{{ msg | msgFormat("疯狂+1", "123") | test }}

// 过滤器的定义语法 // Vue.filter("过滤器的名称", function(){}) // 过滤器中的 function ,第一个参数,已经被规定死了,永远都是 过滤器 管道符前面 传递过来的数据 /* Vue.filter("过滤器的名称", function (data) { return data + "123" }) */

注意!!!先后顺序,要先定义过滤器,在实例化vue,否则会Failed to resolve filter

修饰符的应用
 

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

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

相关文章

  • 学习Vue.js-Day2

    书接上文/思考反馈 react,ng,vue作用差不多,那各个都有什么特点啊,实际工作中应该用哪一个? 答:其实在实际工作中,组员会通过讨论而选择框架;这三个框架都能解放你的工作量,也适合做单页面应用【今天又是努力的一天】 案例:品牌管理案例 结合第一天所学知识,做案例;螺旋式提升开发能力 案例要点: 添加新品牌 删除品牌 筛选品牌 showImg(https://segmentfault.c...

    megatron 评论0 收藏0
  • 学习Vue.js-Day2

    书接上文/思考反馈 react,ng,vue作用差不多,那各个都有什么特点啊,实际工作中应该用哪一个? 答:其实在实际工作中,组员会通过讨论而选择框架;这三个框架都能解放你的工作量,也适合做单页面应用【今天又是努力的一天】 案例:品牌管理案例 结合第一天所学知识,做案例;螺旋式提升开发能力 案例要点: 添加新品牌 删除品牌 筛选品牌 showImg(https://segmentfault.c...

    BakerJ 评论0 收藏0
  • Vue.js-Day01

    摘要:现在,我们可以使用指令将待办项传到每一个重复的组件中现在我们为每个提供待办项对象待办项对象是变量,即其内容可以是动态的蔬菜奶酪随便其他什么人吃的东西 本来是准备学习angular的,但是总是卡在开头看不下去,干脆换个框架,那就vue吧!使用jquery要引入特定的库,那使用vue也类似,可以在头部引入 我觉得vue最重要的理念就是将值和DOM绑定在一起,将数据渲染进DOM有以下几种...

    Clect 评论0 收藏0
  • 学习Vue.js-Day1

    摘要:学习内容,基本语法和概念,打包工具,实战操作参考文献官网官方资料库全家桶全家桶文档概念前端框架借助可以实现手机开发前端框架是一套构造用户界面的框架,只关于视图层前端的主要工作室跟用户界面打交道,中的,实现界面效果框架是为了提高开发 学习内容 1,Vue基本语法和概念 2, 打包工具 Webpack , Gulp3,实战操作 参考文献:官网: https://cn.vuejs.org...

    Cheriselalala 评论0 收藏0

发表评论

0条评论

最新活动
阅读需要支付1元查看
<