我学到的一下vue使用技巧
这两天学到的vue使用技巧
v-if , 当封装组件的时候,用到的props,最外层最好加个v-if,防止出现cannot read property of undefined 这样的错误,如果props中数据层级比较深最好也要加v-if,理由一样。
当一个响应式数据需要频繁使用时,最好用一个变量保存起来,这样可以更少的触发
Object.defineProperty中的getter。computed 的 对象用法, 当相应式数据修改了会导致另一个响应式数据改变时,最好加个set,这样可以更灵活的控制。
当业务中需要定义一个变量,又不需要响应式的时候,没必要定义在data中,定义在created 中就行
e.g
created() {
this.xx = xx
}
封装组件时,要充分考虑扩展性,即便现在的业务用不到,当成
fulture来写。网络请求时,前后端约定的错误码,最好用一个变量来存,这样语义化更强,防止以后看代码的时候打自己。
const ERROR = XX
request(url).then(res=> {
if (res.code === ERROR) {
xxxx
}
})
我学到的一下vue使用技巧的更多相关文章
- 一起学微软Power BI系列-使用技巧(2)连接Excel数据源错误解决方法
上一篇文章一起学微软Power BI系列-使用技巧(1)连接Oracle与Mysql数据库中,我们介绍了Power BI Desktop中连接Oracle和Mysql的方法,其实说到底还是驱动的问题, ...
- vue的技巧代码
转载:https://segmentfault.com/a/1190000014085613 第一招:化繁为简的Watchers 场景还原: created(){ this.fetchPostList ...
- vue 使用技巧总结 18.11
前言: 在大概学完 vue 整体框架后,有幸接触到花裤衩大神写的 vue-elementUI-admin 模板框架,把这个模板框架当作 demo,跟着 code 一遍,最大的收获是在以逻辑简单的模板熟 ...
- vue小技巧之偷懒的文件路径——减少不必要的代码
众所周知,我们写vue项目的时候都会创建很多个文件,尤其是一些中大型项目,会有很深的文件夹,当你去引入的时候,要写很长的路径比如我要引入一个css文件, 必须得 import '../../../s ...
- Vue 开发技巧或者说Vue知识点梳理(转,自个学习)
Vue 组件通讯 ——常见使用场景可以分为三类: 父子通信: 父向子传递数据是通过 props,子向父是通过 events($emit):通过父链 / 子链也可以通信($parent / $child ...
- Vue 开发技巧总结
博客地址:https://ainyi.com/95 本人玩了 Vue 两年多,在此总结一下开发时的一些技巧和方法 自定义组件 v-model v-model 是 Vue 提供的一个语法糖,它本质上是 ...
- vue使用技巧(分页、nextTick、复制对象)
分页技巧 v1.0+ 版本的时候使用过滤器 limitBy 实现 v2.0+ 版本的时候使用compute使用 slice 方法实现 data:{ pageNum:10 }, computed:{ n ...
- Vue小技巧-懒加载
Vue懒加载包括图片懒加载与路由懒加载 1.图片懒加载: 首先安装 vue-lazyload包 然后导入并加载事先下载好的加载图片 import VueLazyLoad from 'vue-lazyl ...
- 教你一个vue小技巧,一般人我不说的
本文由云+社区发表 1. 需求 最近的项目中,需要实现在vue框架中动态渲染带提示框的单选/多选文本框,具体的效果如下图所示,在输入框聚焦时,前端组件通过接收的kv参数渲染出选项,用户点击选项,可以将 ...
- vue 使用技巧总结 19.01
组件中箭头函数的使用 不要使用箭头来定义任意生命周期钩子函数: 不要使用箭头来定义一个 methods 函数: 不要使用箭头来定义 computed 里的函数: 不要使用箭头定义 watch 里的函数 ...
随机推荐
- 从零开始基于Archlinux 安装 containerd + k8s
下载ISO文件:https://mirrors.tuna.tsinghua.edu.cn/archlinux/iso/latest/ 目录 1. 准备工作 2. 磁盘管理 2.1 磁盘分区 2.2 磁 ...
- [C++基础入门] 7、 指针
文章目录 7 指针 7.1 指针的基本概念 7.2 指针变量的定义和使用 7.3 指针所占内存空间 7.4 空指针和野指针 7.5 const修饰指针 7.6 指针和数组 7.7 指针和函数 7.8 ...
- 面试题:react、vue中的key
1.虚拟DOM中key的作用 key是虚拟DOM对象的标识,当数据发生变化时,React/Vue会根据[新数据]生成新的[虚拟DOM],随后React/Vue进行[新虚拟DOM]与[旧虚拟DO ...
- 2023-02-11:给你两个整数 m 和 n 。构造一个 m x n 的网格,其中每个单元格最开始是白色, 请你用 红、绿、蓝 三种颜色为每个单元格涂色。所有单元格都需要被涂色, 涂色方案需要满足:
2023-02-11:给你两个整数 m 和 n .构造一个 m x n 的网格,其中每个单元格最开始是白色, 请你用 红.绿.蓝 三种颜色为每个单元格涂色.所有单元格都需要被涂色, 涂色方案需要满足: ...
- 2022-09-30:以下go语言代码输出什么?A: true true false true false; B: true false false true false; C: true true
2022-09-30:以下go语言代码输出什么?A: true true false true false: B: true false false true false: C: true true ...
- 代码随想录算法训练营Day36 贪心算法
代码随想录算法训练营 代码随想录算法训练营Day36 贪心算法| 435. 无重叠区间 763.划分字母区间 56. 合并区间 435. 无重叠区间 题目链接:435. 无重叠区间 给定一个区间的集合 ...
- 图扑虚拟现实 VR 智慧办公室可视化
前言 "虚拟现实"是来自英文"Virtual Reality",简称 VR 技术,其是通过利用计算机仿真系统模拟外界环境,主要模拟对象有环境.技能.传感设备和感 ...
- 【python基础】复杂数据类型-列表类型(数值列表)
1.数值列表 列表非常适合用于存储数字集合,而python提供了很多工具,可帮助我们高速地处理数字列表. 1.1 range函数 python的range函数能够轻松的生成连续一系列数字. 其语法格式 ...
- Vue3 之 响应式 API reactive、 effect源码,详细注释
Vue3之响应式 API reactive. effect源码,详细注释 目录 一.实现响应式 API:reactive.shallowReactive.readonly.shallowReadonl ...
- 龙芯下如何进行.net core程序开发部署
龙芯LoongArch64已经发布了对.NETCore的支持,相关工具链也已完成,目前支持.NETCore3.1..NET6..NET7版本.本文以.NETCore3.1在loongnix-serve ...