冰魂魄的博客

在项目开发中，使用el-tree 进行懒加载的时候，如果遇到需要进行添加 删除操作的时候，整体刷新数据体验会很不好，所以需要局部进行刷新,我们可以通过找到树节点的形式，对当前展开的节点进行重新打开请求一次，以此来获取最新数据 <el-tree lazy ref="tree" :load="loadNode" :node-key="id" > </el-tree>methods: { refresh..

1.安装依赖npm install vue-qr --save2.项目内使用：<div id="qrcode"> <vue-qr :text="companyInfo.qrcode_url" :size="200"></vue-qr></div>import VueQr from 'vue-qr'components:{ VueQr},data() { return { companyInfo:{} .

如果只是对于超出隐藏 可以直接使用ellipsis 进行设置，方便快捷columns = [{ id: "1", checked:true, width: 100, title: '更新时间', dataIndex: 'update_at', ellipsis: true,}]但有的时候 title的hover显示效果 满足不了我们的需求 ， 要求我们使用类似于tooltip的形式 对省略的字段进行显示 代码如下：columns = [{ i...

# 安装模块到项目目录下npm install moduleName#-save 的意思是将模块安装到项目目录下，并在package.json文件的dependencies节点写入依赖。npm install moduleName -save#--save-dev 的意思是将模块安装到项目目录下，并在package.json文件的devDependencies节点写入依赖。npm install moduleName --save-devnpm install moduleName.

问题我们本地调试一般都是npm run serve，然后打开本机ip:8080（localhost:8080）对吧，这时候我们要调接口调试，后端的接口的地址可能在测试环境，也可能是自己电脑的 ip，总之不是你的lcoalhost:8080，那么你调接口就会产生跨域，那么怎么办呢？就需要proxy出场了复习一下跨域的解决方案jsonp cors Node中间件代理(两次跨域) nginx反向代理CORS支持所有类型的HTTP请求，是跨域HTTP请求的根本解决方案JSONP只支持GE...

实现中英文翻译切换以及cookie 存储需要安装以下依赖npm install vue-i18n --savenpm install js-cookie --savemain.js 内 注入i18nimport Vue from 'vue'import App from './App.vue'import router from './router'import store from './store'import ElementUI from 'element...

可以先进行排除是不是因为网络问题的原因，如果网络无问题的话 可以安装淘宝镜像，使用cnpmnpm install -g cnpm --registry=https://registry.npm.taobao.org如果还是不行的话 ，一直停留在这个地方 出现这个情况有可能是由于 npm 的镜像没有改，是使用系统默认的。解决的办法通常是改为淘宝的镜像。问题解决流程1. 显示当前的镜像网址// 把下面这个命令粘贴到 cmd 或终端上执行npm get regi...

新建文件 preventBackspace.jsexport const stopBackSpace = (e) => { let ev = e || window.event // 各种浏览器下获取事件对象 let obj = ev.relatedTarget || ev.srcElement || ev.target || ev.currentTarget // 按下Backspace键 if (ev.keyCode === 8) { // 标签名称 ..

mixins混合 (mixins) 是一种分发 Vue 组件中可复用功能的非常灵活的方式。混合对象可以包含任意组件选项。当组件使用混合对象时，所有混合对象的选项将被混入该组件本身的选项。具体合并策略：1、datamixins中的data会合并到data中，有冲突的话，data中数据覆盖mixins中的数据。2、钩子函数mixins中的钩子函数也会执行，先执行mixins中的钩子函数。3、methods、components和directivesmethods、com...

目录 表单修饰符 事件修饰符 鼠标按键修饰符 键值修饰符 v-bind修饰符（实在不知道叫啥名字） 表单修饰符填写表单，最常用的是什么？input！v-model~而我们的修饰符正是为了简化这些东西而存在的 .lazy <div><input type="text"v-model="value">...

路径 ： 文件---首选项--用户代码字段 搜索vue.json 如下图所示进入vue.json 文件 会出现如下 的注释代码代码如下： "demo": { "prefix": "vhtml", "body": [ "<template>", " <div class=\"$1\">", " ", ...

项目需求： 对每个单页面进行微信分享的标题 描述 缩略图和链接设置1：引入微信sdk文件 安装依赖npm install weixin-js-sdk --save2：在assets下新建一个js文件 wx_share.js import axioss from 'axios'import wx from 'weixin-js-sdk' //微信sdk...

安装npm install vue-awesome-swiper引入： main.jsimport VueAwesomeSwiper from 'vue-awesome-swiper'Vue.use(VueAwesomeSwiper)使用swiper 进行轮播效果 关于左右按钮出现的问题 主要是 slot问题 <swiper :option...

正常的表单验证 ：<el-form :model="ruleForm" :rules="rules" ref="ruleForm" class="search_area"> <el-form-item label="联系电话" prop="phone" class="itemRequiredStyle"> <el-input v-mod...

在el-input 内 使用 keyup等事件 需要添加 .native 否则无法正常执行事件。限制输入正数 保留两位小数。下面是 只可输入数字。

<el-input size="small" v-model="scope.row.order_number" v-show="scope.row.isShowInp_order" @blur="editOrder(scope.$index,scope.row)" v-focus @keyup.native="UpNumber" @keydown.native=...

出错点：Invalid default value for prop "rowMsg": Props with type Object/Array must use a factory function to return the default value.出错写法：解决办法 ：如果是数组的话 写成 default : () => []...

完全按照文档操作即可 https://element.eleme.cn/2.0/#/zh-CN/component/menu#navmenu-dao-hang-cai-dan需特别注意的是 ： 一定要定义下 el-menu 的样式以官网代码为例： .el-menu-vertical-demo:not(.el-menu--collapse) { width: ...

// 多选只能选择一个 <el-checkbox-group v-model="lessonForm.ladder" @change="ladderChange"> <el-checkbox v-for="(item, index) in ladderList" :key="item" :label="index" &gt...

项目开发中，有时候会遇到对表头进行自定义添加样式的操作 如下图需求所示：我们可以通过设置slot来进行自定义表头样式 闲话不说，直接上代码<el-table-column align='center'> <!-- 自定义头部 --> <template slot="header"> <span class="btnWarn...

&lt;script&gt;export default { name: "Home", data() { return {}; }, methods: { // 组件的方法 }, watch: { // watch擅长处理的场景：一个数据影响多个数据 }, computed: { // computed擅长处理的场景：一个数据受...