vue

在main.js中引用封装的js文件 import Vue from 'vue' //v-focus:输入框聚焦 Vue.directive('focus',{ inserted:function(el){ el.querySelector('input').focus() } }) 版权声明：本文为HTML5_student原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链…

移动端框架vant-ui： <van-cell-group class="m30 borderRadius"> <van-field v-model="content" rows="5" autosize type="textarea" placeholder="请输入内容" /> </van-cell-group> if(this.content==""){ …

.vue文件写css样式的方法：1、在.vue文件中的style标签中，直接编写css样式；2、在.vue文件中的style标签中，使用@import引入外部css样式文件。 .vue文件怎么写css样式 .vue文件由结构——行为——样式三部分构成，分别对应template、script、style标签，css样式就写在style标签中。 一、直接在Test.vue中写css样式 这是标题 ex…

v-if：根据表达式的值的真假条件渲染元素，在切换时元素及它的数据绑定/组件被销毁并重建。v-if 控制元素的渲染 v-if 为假 该元素不会创建 v-show：根据表达式之真假值，切换元素的display CSS 属性。 可以控制元素的显示隐藏通过display none v-for：循环指令，基于一个数组或对象渲染一个列表，Vue 2.0 以上必须需配合key值使用。绑定一个 标签 循环一个数…

目录 1、前端路由的规则 1、URL的hash 2、HTML5的history模式：pushState 2、vue-router的使用步骤 1、定义vue-router 2、挂载到Vue实例中 3、创建路由组件 4、配置组件和路径的映射关系 5、使用路由 3、vue-router的一些配置 1、路由的默认路径 2、配置History模式 3、router-link补充 4、路由代码跳转 1、前端路…

动态路由，基本上每一个项目都能接触到这个东西，通俗一点就是我们的菜单是根据后端接口返回的数据进行动态生成的。表面上是对菜单的一个展现处理，其实内部就是对router的一个数据处理。当然你只对菜单做处理也是可以的，但是没有任何意义，熟悉router的小伙伴都知道，如果你的一个路由存在，即使没有这个菜单，我只要改变浏览器的地址一样能访问到。所以你还是省不了修改router的步骤。通过接口获取数据的话就…

最近有小伙伴询问Vue中插槽的使用，或者有些对插槽比较陌生的有比较想用的，这里我就针对Vue的插槽使用方式进行简单的讲解，其实对于插槽最全的还要属 官方文档 ，但是有些小伙伴就是不爱看 官方文档 ，那么就来看下我这边对插槽基础使用的叙述吧，希望对你有用！！！ 首先我们先了解插槽的分类，插槽分为默认插槽（这个叫法可能有不一样的，但是都是一个东西，我这比较习惯成为默认插槽）、具名插槽和作用域插槽。下边…

一、首先，自定义loading组件（loading.vue） <template> <div class="markbox" v-show="loading" style="background-color: rgba(0, 0, 0, 0.2);"> <div class="loadEffect"> <span></span> <…

vue自定义插件 封装一个类似 element 中 message 消息提示框的插件 一、资源文档 1.vue内置组件 transition 2.Vue.use() 3.Vue.extend() 4.Vue.render() 5.vm.$mount 6.vm.$destroy 二、实现源码 1.目录结构 2.插件模板 3.插件执行逻辑 4.插件安装 5.插件使用 6.插件效果 本文是在钻研与学习该…

基于webpack5搭建的vue2脚手架 本代码已发布npm，直接使用npm即可安装 npm i webpack-vue2-cli -g wvc 项目名称 内容简介 1.ESLint插件 2.图片压缩 3.代码压缩 4.项目拆包分包 5.前端离线化 … 等等一系列优化操作以及 详细的注释 ，方便同学们学习 当时写这套代码的原因是因为公司老项目各方面性能太慢，所以决定升级脚手架 也可用于公司老项目直…