随笔分类 - Vue
摘要：一、添加 prop 清空验证和内容<el-form-item label="排序" prop="orders"> <el-input v-model="ruleForm.orders"></el-form-item>在 <el-form ref="ruleFormRef ">添加 ref属性，然后使
阅读全文
摘要：1、首先需要修改App.vue <template> <div id="app"> <router-view v-if="isRouterAlive" /> </div> </template> <script> export default { name: "App", provide() { r
阅读全文
摘要：这是一个提示框和对话框，例： 这是一个组件 eject.vue <template> <div class='kz-cont' v-show='showstate'> <div class='kz-wrapper' > <div class='kz-text'> <strong><slot name
阅读全文
摘要：需求概述 vue-quill-editor是我们再使用vue框架的时候常用的一个富文本编辑器，在进行富文本编辑的时候，我们往往要插入一些图片，vue-quill-editor默认的处理方式是直接将图片转成base64编码，这样的结果是整个富文本的html片段十分冗余，通常来讲，每个服务器端接收的po
阅读全文
摘要：<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Vue filters</title> <script src="https://cdn.jsdelivr.net/npm/vue"></script> </head> <body
阅读全文
摘要：场景：在vue项目中文本超过三行展示省略号，并加上展开和收起的功能 在处理多行文本时，经常会遇到各种各样的需求，比如至多展示三行，多余的部分不展示并以省略号结尾；又比如在这个基础上加上一个展开和收起的功能。同时UI的展示上还要求和文本本身的位置相对应。 具体实现思路如下： 1、判断当前内容是否超过三
阅读全文
摘要：问题描述： 进入A页面——>B页面——>ios自带的返回——>白屏出现——>手动点击白屏处——>问题解决； 原因是，经过排查，发现在ios 机器上使用webview 开发Vue项目时候，go history (-1)，无法将body 的高度拉掉，使得遮住，触发轻点击，方可消除该遮罩 解决的理论：用于
阅读全文
摘要：<li v-for="(list,index) in getTableData(currentPage)" :key="index"> <div class="popup-msg-div"> <div class="msg-div-add">{{list.detail_address}}</div>
阅读全文
摘要：我们在开发中会封装许多的通用的组件，那么如何封装好一个组件时，在调用的时候绑定click事件呢？1.child组件 <template> <div class="child" @click="$emit'childClick',123) /> //说明：第一个参数：childClick ，是事件名，
阅读全文
摘要：1. 在根目录下新建 .env.xx (xx可以是自己取的用来区分这三个环境） 下面是我新建的，分别对应测试环境，开发环境，正式环境 2. 配置 测试环境： NODE_ENV = 'production' VUE_APP_FLAG = 'test' outputDir = 'test' 开发环境：
阅读全文
摘要：1、安装 npm install vue-wechat-title --save 或 npm install vue-wechat-title -S 2、使用，在main.js中引用插件 import VueWechatTitle from 'vue-wechat-title' Vue.use(Vu
阅读全文
摘要：安装postcss-px-to-viewport npm install postcss-px-to-viewport 根目录新建postcss.config.js文件 //postcss.config.js文件 module.exports = { plugins: { 'postcss-px-t
阅读全文
摘要：cli3创建vue项目是精简版的少了build和config这2个文件，所以配置开发环境、测试环境、生产环境的话需要自己创建env文件。 需要注意2点： 1、cli2创建项目生成的config文件里的env文件是js后缀 2、cli3创建自定义env文件的话不需要js后缀 下面开始创建配置： 一、直
阅读全文
摘要：一、安装axios npm install --save axios 二、在src下面创建文件夹api=>api.js(接口集合)+http.js(封装的请求) 三、在main.js中引用api.js和http.js //引入两个文件 import api from './api/api' impo
阅读全文
摘要：1.下载lib-flexible 使用的是vue-cli+webpack，通过npm来安装的 npm i lib-flexible --save 2.引入lib-flexible 在main.js中引入lib-flexible import 'lib-flexible/flexible' 3.设置m
阅读全文
摘要：1、安装 cnpm i qrcodejs2 -S 2、项目中使用 HTML: <!-- 放置二维码的容器,需要给一个ref --> <div id="qrcode" ref="qrcode"></div> js: // 引入 import QRCode from 'qrcodejs2' method
阅读全文
摘要：先看看效果图： 一，首先创建一个公共的文件夹treeTable,里边放一个index.vue和eval.js 先看看index.vue，原理就是在element-ui的基础上做了进一步改造。 eval.js放入下列代码 二，页面中的用法
阅读全文
摘要：<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv
阅读全文
摘要：公司有个项目要实现一个聊天功能,需求如下图,略显随意 公司最终选择融云这个吊炸天的即时通信,文档详细的一匹,刚开始看文档感觉很详细实现起来也不麻烦,有很多开源的demo可以在线演示和下载 不过我们的项目是vue cli创建的,文档就没这个了,网罗了一堆博客也有说vue使用的不过都不是很齐全 就总结了
阅读全文
摘要：选择了开始时间，再选择结束时间的时候就不能早于开始时间；选择了结束时间，再选择开始时间的时候就不能晚于结束时间； 如果开始时间为空，选择结束时间只能是今天之后的时间； <el-date-picker v-model="ruleForm.startTime" type="date" placehold
阅读全文
浙公网安备 33010602011771号