Vue
莉兹Liz
good good study, day day up!
展开
-
移动端h5图片加载问题,预加载、div标签替换img
在开发移动端h5时遇到图片加载不出来的问题,分为大图片和小图片(打包base64区分)大图片加载解决办法:reload预加载小图片加载解决办法:div标签替换为img标签特殊情况:div标签按钮有点击动效,即按下按钮时active替换为另一张图片按钮点击动效 .game-btn { position: absolute; width: 180px; height: 180px; margin-top: 280px; backgro原创 2021-12-17 14:56:58 · 1486 阅读 · 0 评论 -
vue watch
watch: { num1(val) { console.log("===num1", num1); }, num2: { handler(val) { console.log("===num2", num2); }, // 对象 immediate: true // 立即执行 }}原创 2021-11-02 11:04:36 · 96 阅读 · 0 评论 -
Vue前端代码添加单元测试Unit Test
单元测试Unit Test(单测)单测好处多多,保证代码正确性、提高代码和技术水平、利于重构等等,但是前端写单测也很难,网上例子很少,业务需求迭代快,没有特殊要求和自我追求没人搞这个吧?哦,我为啥写,领导绩效写了,我就写了,写了就得做。领导搞后端的:)栗子万事开头难,百度减一半,推荐Vue测试指南1、安装vue脚手架yarn global add @vue/cli2、创建项目vue create zsy_ut,创建的时候,注意选择 “Manually select features” 和 “Uni原创 2021-09-23 19:06:06 · 1838 阅读 · 0 评论 -
vue中style设置scoped后部分样式不生效
vue中为了使样式不影响其他页面,style设置了scoped。但设置后style中部分样式不生效,尤其是组件自身样式的修改。解决:可以在不生效的样式前加/deep/<style lang="less" scoped>/deep/ .el-table td:nth-child(1),/deep/ .el-table td:nth-child(3) { text-align: right;}</style>例子随便写的,效果不用这样实现,具体看文档。...原创 2021-07-20 09:48:49 · 2528 阅读 · 0 评论 -
搭建一个Vue3项目
使用Vue官方脚手架CLI搭建1、yarn global add @vue/cli@next // 全局下载vue/cli2、vue create 项目名 // 例如vue create vue_demo3、选择Manually select features4、空格选择Choose Vue version, Babel, Router, Vuex, CSS Pre-processors, Linter,最后按回车5、Vue2还是Vue3?选了Vue3,用最新的技术,做最靓的崽儿。(Vue2之前用原创 2021-03-05 17:20:06 · 267 阅读 · 1 评论