vue的一些坑(第二天)
首先啊感谢一位小童鞋的指出其实我写的这些内容算不上坑,只是平时使用的时候的一点小问题,不过只是个名字啦!再次致谢
1:两个简写的命令
v-bind:class可以简写为 :class
v-on:click可以简写为 @click
2:这里解释一下上面为什么会提到v-bind:class
如果你在vue项目里面想要对一个标签添加一个class的话,就必须要用到这个东西了,然后嘞!
这个v-bind:class后面的语句有特殊的写法,不能够直接放个类名在哪里,这里通常是需要写成对象形式的,数组也可以;
这里又引申出另外一个问题了,如果说当前操作的这个对象没有这个属性该怎么办--》如下
item里面没有checked这个属性怎么办?
:class="{'check':item.checked}"
这个时候我们就需要在js里面需要用到这个属性的方法里面添加
if(typeof item.checked == 'undefind')(因为没有这个属性所以在用的时候会提示undefind)
Vue.set(item,'checked',true)相当于给item注册了一个checked(详情参考文档)
这里注册的这个属性是全局的,也可以使用 this.$set(....);同上效果一样只是作用域的区别
3:过滤器
Vue.js 允许你自定义过滤器,过滤器的写法官方文档有,这里不再赘述
就说一下全局过滤器这个东西,他可以在这个项目的任何一个页面进行调用,而局部的过滤器只能在当前实例内部进行使用
而且这个全局过滤器的写法还有点特殊,在vue1+里面过滤器里面的参数中间是通过空格进行传入的。但是在2.0里面是写在过滤器里面用 ‘ ,’ 隔开,
更加的像是调用函数,filterName(num1,num2,...);
Vue.js 允许你自定义过滤器,可被用作一些常见的文本格式化。过滤器可以用在两个地方:mustache 插值和 v-bind
表达式。过滤器应该被添加在 JavaScript 表达式的尾部,由“管道”符指示;{{ message | filter }}
过滤器还可以串联:{{ message | filterA | filterB }}4:前台展示的时候如果需要小数点的话尽量把这个事情交给后台去处理,直接更改数据,并非我们前端做不到,只是这个在前端使用value.toFixed()的时候会出现精度上面的损失,这个尽量让后台处理一下数据。
结语:因为今天别的事情耽误了,所以学习的东西比较少,暂时就分享到这里。
转载于:https://www.cnblogs.com/flyboy-fb/p/7355368.html
vue的一些坑(第二天)相关推荐
- vuex modules ajax,VUE项目爬坑---6、vuex的真正存在的意义是什么
VUE项目爬坑---6.vuex的真正存在的意义是什么 一.总结 一句话总结: a.[避免低效的数据传递]:当多个组件嵌套的时候,只能父子传递,那么中间的组件只能做传递数据之用,数据不是它用,它却传递 ...
- vue.js踩坑之单向数据流
vue.js父子组件之间的数据通信,细节总结 隐性规则:单行数据流 学前疑问: 1.父组件如何向子组件通信数据? 2.父组件可以直接修改子组件的数据!但是反过来绝对不可以!那怎么解决这个问题呢? 3. ...
- vue.js踩坑之ref引用细节点
vue.js组件之H5页面,DOM标签或者组件中,通过ref="自定义name名称"引用的细节点 要点简介:[ 见下文案例 ] 使用is=" "解决H5出现的标 ...
- html2canvas图片的文字偏移,html2canvas在Vue项目踩坑-生成图片偏移不完整
背景 最近做一个Vue项目需求是用户长按保存图片,页面的数据是根据不同id动态生成的,页面渲染完生成内容图片让用户长按保存的时候,把整个页面都保存起来. 在项目遇到的坑是图片能生成,可是生成的图片总是 ...
- Vue 3 这个坑我踩了,你们一定要小心
大厂技术 高级前端 Node进阶 点击上方 程序员成长指北,关注公众号 回复1,加入高级Node交流群 背景 在我的 <Vue 3 开发企业级音乐 App>课程问答区,有个同学提了个问 ...
- 一步步带你做vue后台管理框架(二)——上手使用 系列教程《一步步带你做vue后台管理框架》第二课
github地址:vue-framework-wz 线上体验地址:立即体验 <一步步带你做vue后台管理框架>第一课:介绍框架 <一步步带你做vue后台管理框架>第二课:上手使 ...
- VUE入门笔记,第二节
VUE入门笔记,第二节 一.总结以上:实例-表格列表 [目标:实现表格数据的添加.删除和过滤筛选] [解决方案] <!DOCTYPE html> <html lang="e ...
- vue eventBus 跳坑的办法
前言(feihua): 最近闲来没事写了一个小的demo,在小的数据传输上没有必要去使用vuex,对于非父子组件的传值方法总结了一点心得体会供大家参考(如有太low,还请大神别喷俺) 先上官方文档: ...
- html2canvas在Vue项目踩坑-生成图片偏移不完整
背景 最近做一个Vue项目需求是用户长按保存图片,页面的数据是根据不同id动态生成的,页面渲染完生成内容图片让用户长按保存的时候,把整个页面都保存起来. 在项目遇到的坑是图片能生成,可是生成的图片总是 ...
- go html vue,[终极巨坑]golang+vue开发日记【三】,登陆界面制作(二)
写在前面 本期内容是承接上期已经做好了登陆界面来写的,不过本期是以golang为主,可能需要大家把最基本的语法结构熟悉一下:菜鸟教程.这样的话方便展开,自然而然的,本篇也是直接实战为主.这次需要依赖m ...
最新文章
- 切换JAVAC的方法
- MySQL复制经常使用拓扑结构具体解释
- Android 数据存储 Room
- 社区儿童计算机活动总结,社区亲子活动总结
- 八皇后时间复杂度_LeetCode46:全排列(八皇后)
- 系统不做限流,我看你是对中国人口数量有什么误解
- 文件磁盘相关函数[2]-建立新文件 FileCreate
- pandas 筛选出满足条件的行并赋值
- Java练习例子:计算圆柱体积
- android 位移传感器 坐标,一种基于1D位移传感器的三维空间坐标测量方法与流程...
- windows gitbub使用
- 《新浪微博平台架构》---阅读
- 点菜系统(适合Java基础练习)
- BP神经网络的初步介绍
- 斑马电商云品牌发布会就是一群有梦想的人在搞事情
- 移动设备技术_手机底层板子设计人员告诉你一般手机电池的正确使用方法
- 浅析嵌入式系统之uboot详解(5.1)—时钟分频
- 实验四:无向图最短路径搜索
- 解决org.apache.rat:apache-rat-plugin:0.8:check (default) on project hbase: Too many unapproved license
- 华为云学院-人人学loT学习笔记及扩展- 第二章 物联网平台OceanConnect
热门文章
- Illustrator中文版教程,如何在 Illustrator 中使用不透明度和混合模式?
- Mac用户如何在Deckset中使用Ulysses?
- 矢量图形设计工具Artboard快捷键汇总
- centos7安装图形界面
- support.SerializationFailedException: Failed to deserialize payload.
- 百度前端技术学院-task1.8源代码以及个人总结
- TC SRM 665 DIV2 A LuckyXor 暴力
- 粒子群算法(1)----粒子群算法简单介绍
- 打开游戏要运行19.8亿次 if 语句?黑客嘲讽RockStar游戏代码太烂了
- 冒充中科大少年班校友被打脸!AI 公司创始人被扒清华硕士和斯坦福博士均造假...