vue
关注
分享
扫一扫
文章平均质量分 54
微笑边缘的金元宝
观察入微的眼睛，波澜不惊的内心，希望我能拥有。
展开
-
vuejs 2.x 从源码看生命周期；vue源码
vue2的源码；vue2生命周期原创 2023-01-30 08:16:36 · 355 阅读 · 0 评论 -
vuejs 2.x；gzip文件压缩 compression-webpack-plugin；可视化资源分析webpack-bundle-analyzer；splitChunks分包；
【代码】vuejs 2.x；gzip文件压缩 compression-webpack-plugin；可视化资源分析webpack-bundle-analyzer；splitChunks分包；原创 2023-01-17 13:34:11 · 488 阅读 · 0 评论 -
nuxt.js 在开发环境使用 mock
安装npm install mockjs -D新建mock文件夹目录结构如下plugins/mock/index.jsimport management from './constant/app'console.log(process.env.NODE_ENV,'process.env.NODE_ENV'); // developmentif(process.env.NODE_ENV === 'development'){ const Mock = require('mockjs')原创 2021-08-07 20:57:02 · 1554 阅读 · 0 评论 -
vue2.x，watch监听的一个变量在一个function中被连续多次赋值,watch会触发几次？vue源码
前几天被同事问了这个问题，我毫不犹豫说是 执行两次；实际结果是 一次；官方的给出的解释是：详细地址翻看源码找到：原创 2021-03-15 16:59:47 · 1554 阅读 · 0 评论 -
vue2 按需引入 vuex 模块
目录store/index.tsimport Vue from 'vue'import Vuex from 'vuex'Vue.use(Vuex)// 使用 require.context 动态引入 vuex modulesconst modulesFiles = require.context('./common', true, /\.ts$/)const modules = modulesFiles.keys().reduce((module: any, modulePath) =&原创 2021-05-11 14:18:23 · 834 阅读 · 0 评论 -
vue2 + vant + typescript（TS）使用 postcss-to-px-viewport
module.exports = { ...... // css 相关配置 css: { // 为预处理器的 loader 传递自定义的选项。 loaderOptions: { postcss: { // 传递给 postcss-loader的自定义选项 plugins: [ require('postcss-px-to-viewport')({ unitToConvert: 'px', //需原创 2021-04-28 16:24:22 · 998 阅读 · 0 评论 -
vue2前端工程化动态引入文件(require.context) vue全局注册组件 vue router 模块化 vuex
require.context主要使用require.context实现前端工程化动态引入文件require.context(directory, useSubdirectories = false, regExp = /^.//)require.context 参数目标文件夹是否查找子集 true | false正则匹配比如：require.context('./router',true,/\.routes\.js/)可以理解为获取router文件下以.routes.js结尾的文原创 2021-04-27 16:08:20 · 1984 阅读 · 1 评论 -
不安装按需加载的插件， 实现element ui 或者 vant按需引入
vue模板中的使用配置<!-- 员工筛选 --><template> ...... //element ui select组件命名方法 <el-select v-model="" placeholder=""> <el-option v-for="item in arr" :key="item.w" :label="item.n" :value="item.w"原创 2021-04-06 19:17:16 · 550 阅读 · 2 评论 -
VUE3+Vant3，IOS10以下：cannot declare a const variable twice: ‘e‘
问题：代码编译后，苹果手机 IOS 10 以下的系统报错，cannot declare a const variable twice: 'e’报错内容意思就是：变量e不能被声明两次；例如编译后：let e = 'xx';if(true){ let e = 'yy';}注意：这段代码在浏览器里可以正常执行，因为let的作用于是块级作用于，但是在ios10系统中则会报错；由此确定这是ios10的一个bug；前提：首先当前使用的vue-cli 内置了 uglifyjs-webpack-pl原创 2021-03-11 20:45:18 · 873 阅读 · 0 评论 -
VUE中v-for中在动态删除子元素的时候不要用index做key值
key的含义和作用key 的特殊属性主要用在 Vue 的虚拟 DOM 算法，在新旧 nodes 对比时辨识 VNodes。如果不使用 key，Vue 会使用一种最大限度减少动态元素并且尽可能的尝试就地修改/复用相同类型元素的算法。而使用 key 时，它会基于 key 的变化重新排列元素顺序，并且会移除 key 不存在的元素。有相同父元素的子元素必须有独特的 key。重复的 key 会造成渲染错...原创 2020-04-27 15:40:11 · 1427 阅读 · 0 评论 -
javascript function的参数arguments
function a(query){ b(query)}function b( queryB,arguments){}上面的情况就需要argument来获取function a传给 function b的值，并且不影响 function b 使用参数 queryB在vue中可以使用$event子组件出发this.$emit('vueA', queryA)子组件绑定的事件@vu...原创 2020-01-21 16:22:20 · 362 阅读 · 0 评论 -
VUE生命周期
这篇博客将会从下面四个常见的应用诠释组件的生命周期，以及各个生命周期应该干什么事1、单组件的生命周期1.1 组件 v-if 和 v-show 切换时生命周期钩子的执行2、父子组件的生命周期2.1 组件 v-if 和 v-show 切换时生命周期钩子的执行3、兄弟组件的生命周期3.1 组件 v-if 和 v-show 切换时生命周期钩子的执行4、宏mixin的生命周期...原创 2019-11-27 17:01:19 · 343 阅读 · 0 评论 -
JS文件中调用VUE的API
import Vue from 'vue' // 在js文件中引入vueconst instance = new Vue() // 生成vue实例命名为 instanceinstance.$set(data,'attrs','a') // 通过常亮instance直接调用vue的API原创 2019-11-14 16:57:35 · 1529 阅读 · 0 评论 -
javascript的对象内容对比（vue源码）
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-U...原创 2019-11-13 16:49:50 · 401 阅读 · 1 评论 -
IVIEW对的table组件超出长度用省略号代替，使用气泡提示。
export function render(itemColumnCode,itemColumnlist){ return (h,params)=>{ if(params.row[itemColumnCode]){ let numberAndEnglish = String(params.row[itemColumnCode]).replace...原创 2019-03-20 13:50:03 · 4964 阅读 · 1 评论 -
VUE的开发规范
Vue规范一、文件夹结构化规范├── index.html 入口页面├── build 构建脚本目录│ ├── build-server.js 运行本地构建服务器，可以访问构后的页面│ ├── build.js 生产环境构建脚本│ ├── dev-client.js 开发服务器热重载脚本，主要用来实现开发阶段的页面自动刷新│ ├── dev-server.js 运行本地开发服务器...原创 2019-03-12 14:39:56 · 729 阅读 · 0 评论 -
vue自定义全局loading
//loading.vue<template> <div class="load"> <div class="load-content"> <img :src="require('src/static/images/loading.gif')"/> <slot></slot> &l...原创 2019-08-02 15:01:43 · 730 阅读 · 0 评论 -
VUE自定义指令，滚动加载
1新建文件 rollingLoad.jsimport Vue from 'vue'Vue.directive('rolling-load', { bind(el, binding) { // 获取element-ui定义好的scroll盒子 const SELECTWRAP_DOM = el.querySelector('.el-table__body-wrapper');...原创 2019-08-13 19:15:26 · 600 阅读 · 0 评论 -
VUE的$attrs和$listeners
父组件 - ParentPage//父组件 - ParentPage<template> <div> <button @click="handleClick('点击父组件hello')">ParentClick</button> <Child @customClick="...原创 2019-09-11 11:37:14 · 211 阅读 · 0 评论 -
ace-editor线上代码编辑器
package.json{"name": "vue-cli","version": "1.0.0","description": "A Vue.js project","author": "lizhi@camelotchi原创 2019-03-11 18:45:37 · 4190 阅读 · 0 评论