随笔分类 -  vue

摘要:前端框架 vue + antvue + ts + axios 场景: 实现导出zip包到本地,导出的zip包可以再编辑后导入系统 导出功能 将数据流转成zip下载到本地 功能实现 使用a标签的下载功能。 download可以设置下载文件的名称 注意当使用download属性实现下载时要添加后缀!!! 阅读全文
posted @ 2021-11-18 18:08 whkl梅 阅读(1502) 评论(0) 推荐(1)
摘要:问题场景 后台不提供富文本存储,所以emoji表情入库会报错 需求要求前端在输入的时候过滤掉表情符号 全局的input 和富文本textarea输入框都需要过滤emoji表情 问题分析 1.每一个input写事件写正则校验代码量实在太多了还很麻烦;所以想用自定义全局指令,就不需要每个用到的地方都去引 阅读全文
posted @ 2021-09-28 18:04 whkl梅 阅读(3635) 评论(1) 推荐(2)
摘要:问题1: windows 电脑用微软中文输入法输入一个字符会显示多个 问题2: mac或者其他中文输入法输入都会有闪烁的抖动感 问题3:由于需求所定,这是一个自定义的输入框,并且要实时更新,所以用不了v-model 与@blur (用mac电脑没重现输入一个字符变多个,截图了测试提的bug,bug被 阅读全文
posted @ 2021-09-24 17:40 whkl梅 阅读(1629) 评论(0) 推荐(0)
摘要:父组件引用子组件时,可以用: 也可以用@ 传递方法。 @是v-on指令的简写,表示监听事件; 用于父子组件之间方法的传递 @是v-on的简写,是为组件绑定事件,子组件不需要接收,在子组件的$listeners上可以找到,可以使用this.$emit('xxx')手动触发,这样就会触发事件上绑定的函数 阅读全文
posted @ 2021-08-31 15:22 whkl梅 阅读(1189) 评论(0) 推荐(0)
摘要:vue上所有生命周期中的钩子方法里(如created,mounted,updated)使用this,this指向调用它的vue实例 (new Vue),this的指向会影响ts的类型推断,为了更好地用class的模式来写vue组件。 vue-class-component 带来了很多遍历 官网 1. 阅读全文
posted @ 2021-07-14 18:40 whkl梅 阅读(2653) 评论(0) 推荐(0)
摘要:一. 通过vite命令构建vue3+ ts vite官网 npm init @vitejs/app or yarn create @vitejs/app 通过附加命令指定项目名称和指定模板 生成的文件结构 在src内添加route store views 文件夹 二.安装其他插件 ant-desig 阅读全文
posted @ 2021-07-13 20:17 whkl梅 阅读(1987) 评论(0) 推荐(0)
摘要:vue 修饰符sync的功能是:当一个子组件改变了一个 prop 的值时,这个变化也会同步到父组件中所绑定。 vue官方文档介绍 .sync修饰符 不使用.sync之前的写法 // 父组件 <parent :message=“bar” @update:message=“updateMessage”> 阅读全文
posted @ 2021-07-12 18:11 whkl梅 阅读(368) 评论(0) 推荐(0)
摘要:1. v-model 用在input上 v-model 是一个语法糖,在input上使用, 相当于v-bind 动态绑定一个value属性, v-on 给当前属性增加input事件 <input type="text" v-model="zm"> <!--等同于下面--> <input type=" 阅读全文
posted @ 2021-07-09 17:29 whkl梅 阅读(1386) 评论(0) 推荐(0)
摘要:Vue 代码层面的优化; webpack 配置层面的优化; 基础的 Web 技术层面的优化。 一、代码层面的优化 1.1、v-if 和 v-show 区分使用场景 v-if 是 真正 的条件渲染,因为它会确保在切换过程中条件块内的事件监听器和子组件适当地被销毁和重建;也是惰性的:如果在初始渲染时条件 阅读全文
posted @ 2020-05-26 23:42 whkl梅 阅读(463) 评论(0) 推荐(1)
摘要:1. 使用vue.mixin全局混入 混入 (mixins) 是一种分发 Vue 组件中可复用功能的非常灵活的方式。混入对象可以包含任意组件选项。当组件使用混入对象时,所有混入对象的选项将被混入该组件本身的选项。mixins 选项接受一个混合对象的数组。 混入的主要用途 1、在你已经写好了构造器后, 阅读全文
posted @ 2020-05-14 14:38 whkl梅 阅读(3778) 评论(0) 推荐(0)
摘要:核心实现类 1. Observer : 它的作用是给对象的属性添加 getter 和 setter,用于依赖收集和派发更新 2. Dep : 用于收集当前响应式对象的依赖关系,每个响应式对象包括子对象都拥有一个 Dep 实例(里面 subs 是 Watcher 实例数组),当数据有变更时,会通过 d 阅读全文
posted @ 2020-05-14 09:50 whkl梅 阅读(459) 评论(0) 推荐(0)
摘要:加入my mint.css 我这里用的postcss的变量定义,如果亲们用的是其他预处理器,要改成其他处理器的定义方式 覆盖mint ui的primary颜色,改为自己UI的主题色 阅读全文
posted @ 2018-10-21 06:13 whkl梅 阅读(9887) 评论(1) 推荐(0)
摘要:render函数是渲染一个视图,然后提供给el挂载,如果没有render那页面什么都不会出来 vue.2.0的渲染过程: 1.首先需要了解这是 es 6 的语法,表示 Vue 实例选项对象的 render 方法作为一个函数,接受传入的参数 h 函数,返回 h(App) 的函数调用结果。 2.其次,V 阅读全文
posted @ 2017-06-09 10:44 whkl梅 阅读(51776) 评论(2) 推荐(8)
摘要:vue-loader则只配置了css加载器以及编译css之后自动添加前缀。(所以才可以直接编译.vue文件里面的sass样式) 上面的代码中调用了exports.cssLoaders(options),用来返回针对各类型的样式文件的处理方式,具体实现如下 阅读全文
posted @ 2017-03-27 18:54 whkl梅 阅读(27198) 评论(0) 推荐(0)
摘要:当我们需要和后台分离部署的时候,必须配置config/index.js: 用vue-cli 自动构建的目录里面 (环境变量及其基本变量的配置) 在'build'部分,我们有以下选项: build.index 必须是本地文件系统上的绝对路径。 index.html (带着插入的资源路径) 会被生成。 阅读全文
posted @ 2017-03-27 17:37 whkl梅 阅读(69629) 评论(2) 推荐(11)