随笔分类 - vue
摘要：问题 将字符串YYYYMMddHHmmss格式化成YYYY-MM-DD hh:mm:ss 解决方案 dateStr(dateStr) { var pattern = /(\d{4})(\d{2})(\d{2})(\d{2})(\d{2})(\d{2})/; //将时间格式化成 yyyy-MM-dd
阅读全文
摘要：vue自定义指令 局部指令：directives 全局指令：Vue.directive() 局部指令 <!-- 准备好一个容器--> <div id="root"> <h2>当前的n值是：<span v-text="n"></span> </h2> <h2>放大10倍后的n值是：<span v-bi
阅读全文
摘要：前言 虽然Vue3肯定是未来的趋势，但还不是很成熟，实际开发中用的也不多，建议学Vue3之前先掌握Vue2，将Vue3作为未来的知识储备。 Vue3快速上手 Vue3简介 2020年9月18日，Vue.js发布3.0版本，代号：One Piece（海贼王） 耗时2年多、2600+次提交、30+个RF
阅读全文
摘要：有时候，依赖 Vue 响应方式来更新数据是不够的，相反，我们需要手动重新渲染组件来更新数据。或者，我们可能只想抛开当前的DOM，重新开始。那么，如何让Vue以正确的方式重新呈现组件呢？ 强制 Vue 重新渲染组件的最佳方法是在组件上设置:key。 当我们需要重新渲染组件时，只需更 key 的值，Vu
阅读全文
摘要：基本使用 1、安装vue-router，命令：npm i vue-router 2、在main.js中应用插件： //引入VueRouter import VueRouter from 'vue-router' //应用插件 Vue.use(VueRouter) 3、编写router配置项 //引入
阅读全文
摘要：vue.config.js配置具体代理规则 module.exports = { devServer: { proxy: { '/api1': { // 匹配所有以 '/api1'开头的请求路径 target: 'http://localhost:5000', // 代理目标的基础路径 change
阅读全文
摘要：动画 <template> <div> <button @click="isShow = !isShow">显示/隐藏</button> <transition name="hello" appear> <h1 v-show="isShow">你好啊！</h1> </transition> </di
阅读全文
摘要：语法：this.$nextTick(callback) 问题：同一个方法内的某一行代码需要它前面的代码渲染成功才能正确执行，但Vue要执行完一个方法里的所有代码才会渲染，这就产生了矛盾 作用：在下一次 DOM 更新结束后执行其指定的回调。
阅读全文
摘要：全局事件总线 介绍 一种组件间通信的方式，适用于任意组件间通信。 在使用全局事件总线之前需要一些知识准备 所有组件实例的原型对象的原型对象就是 Vue 的原型对象，即VueComponent.prototype.__proto__ Vue.prototype 所有组件对象都能访问 Vue 原型对象上
阅读全文
摘要：绑定 父组件：App.vue 子组件：Student.vue 方式一: $emit <template> <div class="student"> <button @click="sendStudentlName">把学生名给App</button> </div> </template> <scr
阅读全文
摘要：需要在浏览器上安装拓展程序vue开发工具，安装好后在控制台上输入$vm即可打印vue组件实例对象。 Vue2、3开发工具都有，可自行下载 百度网盘链接提取码：si5l
阅读全文
摘要：解决方案 mounted() { history.pushState(null, null, document.URL) window.addEventListener('popstate', () => { history.pushState(null, null, document.URL) }
阅读全文
摘要：核心概念 在Vue中实现集中式状态（数据）管理的一个Vue插件，对vue应用中多个组件的共享状态进行集中式的管理（读/写），也是一种组件间通信的方式，且适用于任意组件间通信。 每一个 Vuex 应用的核心就是 store（仓库）。“store”基本上就是一个容器，它包含着你的应用中大部分的状态 (s
阅读全文
摘要：是什么 混入 (mixins)： 是一种分发 Vue 组件中可复用功能的非常灵活的方式。混入对象可以包含任意组件选项。当组件使用混入对象时，所有混入对象的选项将被合并到组件本身，也就是说父组件调用混入对象的属性时用this即可。 怎么用 举个栗子： 定义一个混入对象 父组件引入混入对象 mixins
阅读全文
摘要：v-bind基本使用 动态地绑定一个或多个属性，或者绑定一个组件 prop 到表达式。 语法：v-bind:属性名 = 属性值 <!-- 绑定一个 attribute --> <img v-bind:src="imageSrc"> v-bind语法糖 缩写：: （真实开发时常用） <!-- 缩写 -
阅读全文
摘要：前言 在开发过程中，我们时常会遇到这样一种情况：当vue的data里边有对象或者数组（数组里边的值是对象）时，后续向对象中添加新的属性是不会更新到视图的。 根据官方文档定义：如果在实例创建之后添加新的属性到实例上，它不会触发视图更新。 当你把一个普通的 JavaScript 对象传入 Vue 实例作
阅读全文
摘要：侦听器watch vue中watch是用来监听vue实例中的数据变化 watch监听时有几个属性： handle：其值是一个回调函数，就是监听对象对话的时候需要执行的函数 deep：其值true 或者 false，是否深度监听（一般监听是不能监听到对象属性值变化的，数组除外） immediate：其
阅读全文
摘要：#router router是VueRouter的一个对象，通过Vue.use(VueRouter)和VueRouter构造函数得到一个router的实例对象，这个对象中是一个全局对象，他包含了所有的路由以及许多关键的对象和属性。 举例：history对象 $router.push({path:'h
阅读全文
摘要：1.query方式传参和接收参数 //传参: this.$router.push({ path:'/teacher/edit', query:{ id:id } }) //接收参数: this.$route.query.id 注意:传参是this.$router,接收参数是this.$route,这
阅读全文
摘要：vue+elementUI中单选框el-radio设置默认值 如果后台返回的单选框的值是number：单选框的lable需要设置成 :lable=‘0’;如下： <el-form-item label="仿牌选项：" prop="ifCod" size="mini" class='form-labe
阅读全文
浙公网安备 33010602011771号