Talk is cheap. Show me your code
摘要:工作和生活终于到了图穷匕见的时候 《2019 年终总结 & 2020 年度计划》 2020 年度计划完成情况: 1. 健身时间不少于300天: 达标 只有年初疫情期间懈怠了几天,终于能看出八块腹肌了 PS. 饮食比锻炼重要多了,大概八二开 2. 至少每个月看一本书: 达标 《浪花少年侦探团》,《再见 阅读全文
posted @ 2020-12-30 10:01 Wise.Wrong 阅读(95) 评论(0) 推荐(1) 编辑
摘要:各种偏门捷径实现如图所示的评分组件 一、低配版 const rate = (num) =>"★★★★★☆☆☆☆☆".substring(5 - num, 10 - num); 没错,只需一行代码就能实现评分(狗头) 虽然星星的样式一言难尽,也没有星星的交互,但这种实现方式你想到过吗? 二、标准版 r 阅读全文
posted @ 2020-12-22 11:49 Wise.Wrong 阅读(47) 评论(0) 推荐(0) 编辑
摘要:在上一篇实战演练中,已经将项目搭建好,并介绍了 Router、Vuex 的基本用法 接下来会以一个 Todo List 项目来介绍实战中如何使用 Composition API 一、输入框与列表(按键别名 + computed 类型声明 ) 首先是输入框,由于需要支持回车键提交,所以需要监听 key 阅读全文
posted @ 2020-11-06 10:56 Wise.Wrong 阅读(871) 评论(5) 推荐(0) 编辑
摘要:前面的几篇文章已经大致介绍了 Vue 3 的常用 API,现在综合起来做一个实战演练 配合完整代码食用更香哦,项目地址:https://github.com/wisewrong/test-vue3-demo 一、初始化 首先通过 Vue-CLI 创建一个 Vue 3 项目,详细流程可以参考《Vue3 阅读全文
posted @ 2020-11-04 13:49 Wise.Wrong 阅读(3104) 评论(0) 推荐(0) 编辑
摘要:问题描述: 使用 Vue CLI 创建的项目,在 index.less 文件中定义了一个变量 并在 main.js 中引入 在组件中使用该变量的时候依然会报错 解决方案: 使用 style-resources-loader 提前加载定义全局变量的 less 文件 首先安装依赖包 npm instal 阅读全文
posted @ 2020-10-28 10:54 Wise.Wrong 阅读(463) 评论(0) 推荐(0) 编辑
摘要:在如今的前端开发工作中, 组件之间的参数传递是一个非常常见的问题 Vue 2 已经有了一套非常实用的组件传参机制,Vue 3 在原本的基础上做了些改进 一、父组件传参到子组件 在《Vue3.x 从零开始(二)—— 重新认识 Vue 组件》中已经介绍过 Props 这是最常用的父对子传参方式 上面演示 阅读全文
posted @ 2020-10-16 15:36 Wise.Wrong 阅读(998) 评论(4) 推荐(1) 编辑
摘要:在《Vue3.x 从零开始(二)》中已经介绍了 Mixin 这种抽取公共逻辑的方式 但 Mixin 提供的数据或函数,无法在组件中直观的体现出来 这导致组件的维护人员需要非常熟悉被引入的 Mixin 对象,不然出现重名的情况就容易出现意料之外的 bug 而 Composition API 是以函数的 阅读全文
posted @ 2020-10-12 19:56 Wise.Wrong 阅读(1193) 评论(2) 推荐(1) 编辑
摘要:Vue 3 更新了许多组件中的语法,包括生命周期、filter、setup、teleport 等 为了介绍这些特性,需要先了解一下 Vue 组件的基本玩法 这篇文章介绍的内容基本都是沿用 Vue 2 的语法,只在一些细节上有所调整 一、单文件组件 通过 Vue.createApp() 创建的应用,可 阅读全文
posted @ 2020-09-30 16:28 Wise.Wrong 阅读(1647) 评论(2) 推荐(0) 编辑
摘要:千呼万唤始出来,2020 年 9 月 19 日凌晨,Vuejs 3.0 终于发布了,代号:One Piece 作为一名从 Vue 1.x 就开始接触 Vue 的老玩家,心里只有一句话想说:学不动了... 但学不动也得学... 原本打算写一写 2.x 和 3.x 的差异,但仔细捋了一下发现内容还不少, 阅读全文
posted @ 2020-09-24 15:35 Wise.Wrong 阅读(4825) 评论(0) 推荐(2) 编辑
摘要:问题描述: 将对象中的空字段删掉,比如这样的一个对象: const obj = { name: 'wise', age: 0, info: '', key1: null, key2: undefined, } 处理成为: obj = { name: 'wise', age: 0, } 解决方案: / 阅读全文
posted @ 2020-09-23 15:59 Wise.Wrong 阅读(132) 评论(0) 推荐(0) 编辑