随笔分类 - vue
摘要：实现历史搜索，主要用到了 localStorage 储存 localStorage 可以长久保存整个网站的数据，保存的数据没有过期时间，直到手动去删除。 引入element的 autocomplete输入框 是一个可带输入建议的输入框组件 <template> <div> <el-autocompl
阅读全文
摘要：<el-input v-model.trim="staname" clearable></el-input> //绑定值的时候, 用 v-model.trim 就行了
阅读全文
摘要：如果你在根组件下注入了store,那么就可以在 .vue文件中使用 $store.state.xxx 然后根据颜色颜色选择器，选择的颜色动态改变 $store.state.xxx ，以达到改变背景色跟字体颜色的目的。 <template> <div> <!-- leftbackground 跟 le
阅读全文
摘要：1.在页面上添加audio <template> <div> <audio id="audio" src="/static/newjingbao.mp3"/> //src 后面的链接是我保存在static文件下的一段报警声 <el-button type="warning" icon="el-ico
阅读全文
摘要：今天for循环图片的时候，发现图片不显示,以下是代码 <div v-for="(item,index) in img"> <img :src="item.imc" width="80" height="80"></img> </div> img:[{imc:'./ww.png'},{name:'./
阅读全文
摘要：1.npm 安装 $ npm install vue-baidu-map --save //https://dafrok.github.io/vue-baidu-map/#/ 2.main.js引入 import BaiduMap from 'vue-baidu-map' Vue.use(Baidu
阅读全文
摘要：1.设置按钮的loading属性，为 true 时就是加载中 <el-button type="success" icon="el-icon-search" @click="inquire" :loading="loadingtype">查询</el-button> export default {
阅读全文
摘要：1.cnpm install vue-cli -g //全局安装 vue-cli 2.新建一个文件夹,cd到这个文件夹中，我的文件夹名字是webvue 3.输入 vue init webpack ”项目名称“ 命令新建vue项目 我的新建vue项目名称为 onevue 4.创建成功 cd到 onev
阅读全文
摘要：1.直接上代码 <template> <div> <el-form label-width='0.5rem' style='display:flex' class='fromclass aline'> <el-form-item label="公司" required> <el-input styl
阅读全文
摘要：<el-date-picker v-model="certificatetime" value-format="yyyy-MM-dd" :picker-options="pickerOptions" clearable type="date" placeholder="选择日期" style='wi
阅读全文
摘要：input 输入框需要写在 el-form 中 <el-form ref="userInfo"> <el-form-item label="金额" label-width="0.5rem"> <el-input style='width:0.7rem' v-model="money" autocom
阅读全文
摘要：1.安装导出excel依赖 npm install -S file-saver xlsx npm install -D script-loader 2.在str文件夹中新建文件，引入两份文件 Blob.js和Export2Excel.js 3.在页面中添加导出事件 <el-button type="
阅读全文
摘要：1.引入select选择器 <el-select v-model="defaults" filterable placeholder="请选择" style='width:1.2rem' @change="getdefaults"> <el-option v-for="item in datalis
阅读全文
摘要：1.在static文件下添加setup.js 在里面添加ip， window.ip是添加全局变量 window.ip={ baseurl:'http://localhost:8888'// 自己的ip地址 } 2.将setup.js文件引入index.html <!DOCTYPE html> <ht
阅读全文
摘要：1.展示界面 <div style='font-size:50px;color:red'>{{hour}}:{{branch}}:{{second}}</div> <el-button type="primary" icon="el-icon-video-pause" @click='start'>
阅读全文
摘要：1.安装依赖 npm install echarts -S 2.引入main.js import echarts from 'echarts' Vue.prototype.$echarts = echarts 3.创建一个vue页面 <template> <DIV> <el-card id="mai
阅读全文
摘要：1.引入viewerjs npm install viewerjs 2.在main.js中配置 import Viewer from 'v-viewer' import 'viewerjs/dist/viewer.css' Vue.use(Viewer,{ defaultOptions: { zIn
阅读全文
摘要：1.html代码 <el-upload class="avatar-uploader" :action="url" 请求的地址 :headers='myheaders' 请求头 :on-preview="handlePictureCardPreview" 点击文件列表中已上传的文件时的钩子 :on-
阅读全文
摘要：<div @click='event'>单击事件</div> <div @dblclick='event'>双击事件</div> <div @mousedown='event'>按下事件</div> <div @mouseup='event'>抬起事件</div> <div @mousemove='
阅读全文
摘要：vue无缝滚动插件地址：https://chenxuan1993.gitee.io/component-document/index_prod#/component/svg-bar-default 1.安装插件 npm install vue-seamless-scroll --save 2.引入m
阅读全文
