随笔分类 - Vue
摘要:import Vue from 'vue' // 和main.js同级,自定义指令控制select已选的不给删除 Vue.directive('defaultSelect', { componentUpdated(el, bindings) { const [defaultValues] = bin
阅读全文
摘要:select 类型需要string类型的值才行,否则回显会不对 crud 的自定义下拉选择框,可以设置datatype数据类型,符合后台返回数据类型,就可以正确回显显示
阅读全文
摘要:<a-date-picker :placeholder="placeholder" mode="year" format="YYYY" :open="showYear" v-model="valueYear" @openChange="changeOpen" @panelChange="panelC
阅读全文
摘要:vue的:class设置多个值 :class="[{ 'labTilTemplate': item.editType == 11 }, { 'txtBold': item.bold == 1 }]" 小程序设置多个class class="{{ item.editType?'a':'b'}} {{
阅读全文
摘要:一文学会使用Vue3 本文适合Vue初学者,或者Vue2迁移者,当然还是建议Vue3官网完全过一遍。不适合精通原理,源码的大佬们。 先推荐两个vscode插件 Volar 首先推荐Volar,使用vscode开发Vue项目的小伙伴肯定都认识Vetur这个神级插件,有了它可以让我们得开发如鱼得水。 那
阅读全文
摘要:一、父组件给子组件传参 props props 用法 vue props:{ xxxx: { type: Object, default:null } } 以下有注释的部分是需要写的代码 以下例子是父组件(列表页)加载公共的操作按钮 子组件.vue 以设置权限为例 <template> <vab-q
阅读全文
摘要:http://doc.liangxinghua.com/vue-family/3.2.html
阅读全文
Vue项目详情页:keep-alive与路由的关系、activated生命周期函数、递归组件、css渐变色、动态路由跳转、keep-alive、每次进入页面默认从顶部开始、transition组...
摘要:CSS渐变色样式 递归组件 router-view是设置路由的,router-link是指定跳转到哪个页面的 keep-alive keep-alive会缓存组件, 保存组件的渲染状态。使用keep-alive包裹router-view路由,就可以缓存组件,不用每次进入组件都要重新加载一次页面,同时
阅读全文
摘要:随着前端应用的业务功能起来越复杂,用户对于使用体验的要求越来越高,单面(SPA)成为前端应用的主流形式。大型单页应用最显著特点之一就是采用的前端路由系统,通过改变URL,在不重新请求页面的情况下,更新页面视图。 更新视图但不重新请求页面,是前端路由原理的核心之一,目前在浏览器环境中这一功能的实现主要
阅读全文
摘要:this.$refs 父组件向子组件通信,可以调用子组件里的属性和方法 示例 父组件 <template> <child ref="msg" /> </template> <script> import child from "./child.vue"; export default { name:
阅读全文
摘要:###1、库和框架 Vue是一个渐进式(逐步集成更多的功能)的javascript框架 库:封装属性或方法 框架:拥有自己的规则和元素,比库强大的多 Vue开发模式:传统&工程化开发方式(基于webpack,推荐) ###2、@vue-cli // 安装@vue-cli yarn global ad
阅读全文
摘要:###总结:ref,reactive,toRefs,toRef方法 响应式引用的原理:通过proxy对数据进行封装,当数据变化时,触发模版等内容的更新。 一、ref: 作用:接受一个内部值并返回响应式且可变的ref对象。ref对象具有指向 内部值的单个proxy.value。 ref需要从Vue中引
阅读全文
摘要:如果你之前使用过vue.js,你一定知道在vue中各个组件之间传值的痛苦,在vue中我们可以使用vuex来保存我们需要管理的状态值,值一旦被修改,所有引用该值的地方就会自动更新,那么接下来我们就来学习一下vuex是如何修改状态值的: 我们新建一个vue项目(这里由于我们是讲解vuex,所以对于vue
阅读全文
摘要:###什么是vuex? vuex 是一个专为 Vue.js 应用程序开发的状态管理模式。它采用集中式存储管理应用的所有组件的状态,并以相应的规则保证状态以一种可预测的方式发生变化。 这是vuex官网的解释。我们把它理解为在data中的属性需要共享给其他vue组件使用的部分,即data中需要共用的属性
阅读全文
摘要:先上官方文档: vm.$set( target, propertyName/index, value ) 参数: {Object | Array} target {string | number} propertyName/index {any} value 返回值:设置的值。 用法: 这是全局 V
阅读全文
摘要:前言 Vue3大势不可阻挡,与之而来的就是Vite ,尤雨溪极力推荐的前端开发与构建工具 vue3原生支持TS ,所以TS语法和vue3TS语法学起来 vue中的vuex状态管理也用不顺手,看不顺眼了,换为Pinia Vite是什么 what 下一代前端开发与构建工具 Vite 项目创建 创建脚手架
阅读全文
摘要:Vue插件,用于从Vue上下文中使用本地Storage,会话Storage和内存Storage 一个vue封装的本地储存的方法。 ###1. 安装 NPM npm install vue-ls --save YARN yarn add vue-ls ###2. 使用 import Storage f
阅读全文
摘要:vue中的ref其实功能很强大,下面介绍一下如何使用。 基本用法,本页面获取dom元素 <template> <div id="app"> <div ref="testDom">11111</div> <button @click="getTest">获取test节点</button> </div>
阅读全文
摘要:###前言 vue的组件传值分为三种方式:父传子、子传父、非父子组件传值 引用官网的一句话:父子组件的关系可以总结为 prop 向下传递,事件向上传递 父组件通过 prop 给子组件下发数据,子组件通过事件给父组件发送消息,如下图所示: 下面我们就开始用代码(一言不合就上代码)详细的介绍vue组件传
阅读全文