vue
关注
分享
扫一扫
CJW-Coder
自己的命运，自己做主。
展开
专栏收录文章
- 默认排序
- 最新发布
- 最早发布
- 最多阅读
- 最少阅读
-
vue中结合iview 的上传组件结合xlsx对上传的excel 表格数据进行处理
1.下载 iviewiview 官网2.下载xlsx npm install xlsx --save3.创建excel.js 工具文件 （在utils 文件夹下）import XLSX from 'xlsx';function auto_width(ws, data){ /*set worksheet max width per col*/ const colWidth = data.map(row => row.map(val => { /*i原创 2020-09-12 17:43:18 · 986 阅读 · 0 评论 -
vue-cli3 使用全局定义的sass
1.新建sass 文件2.在vue.config.js 设置注： 新版 sass-loader prependData 旧版data3.页面引入使用原创 2020-05-26 16:02:11 · 522 阅读 · 0 评论 -
vue实现购物车飞入动画。
用的是vue+iview<template> <div> <div style="width: 80%;margin: 20px auto 0"> <Row :gutter="20"> <Col span="24"> ...原创 2020-04-11 21:47:56 · 2674 阅读 · 0 评论 -
Vue和Element-ui实现分页,刷新时数据保持选中的状态不会恢复成默认。
<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <!--引入远程element-ui的样式--> <link rel="stylesheet" href="https://unpkg.com/element-ui/lib...原创 2020-01-07 18:30:35 · 1751 阅读 · 0 评论 -
elementUI,点击表格展开，刷新的时候也展开点击过的表格。点击箭头，或者表格这一行都可以。
<template> <el-table :data="dataList" style="width: 100%" ref="refTable" row-key="id" :expand-row-keys="expands" @row-click="rowClick" @expand-change="expandChange"> ...原创 2019-12-30 18:25:12 · 2475 阅读 · 0 评论 -
vue，根据输入框输入的值动态显示不同的价格区间比例值
<template> <div> <div class="payTotal"> <div class="pay"> <div class="pay-top"> <div class="pay-price" styl...原创 2019-12-09 13:48:09 · 1649 阅读 · 1 评论 -
vue中的$router与$route的区别分析
一.router和router和router和route的区别**$router:是路由操作对象，包含路由跳转的方法，钩子函数等(只写对象)** 例如：history对象 this.$router.push会往history中添加一个新的记录 跳转用的链接就可以使用this.$router.push ,与router-link 跳转一样**$route 相当于当前正在跳转的路由对象，可以...原创 2019-10-09 15:07:29 · 312 阅读 · 0 评论 -
vue中使用Highcharts
1.先全局安装highchartsnpm install highcharts --save 2.在main.js引入使用配置import HighCharts from 'highcharts'Vue.prototype.$HighCharts = HighCharts;3.使用1.定义图表容器id<template> <div> <div ...原创 2019-10-09 11:50:47 · 744 阅读 · 0 评论 -
vue中父组件获取子组件的数据与方法，子组件获取父组件中的数据与方法
父组件获取子组件中的数据与方法1.调用子组件的时候，通过设置ref<Child ref="child"></Child>2.在父组件中通过this.$refs.child.属性 //this.$refs 获取子组件中的内容this.$refs.child.方法父组件<template> <div id="father"&...原创 2019-09-26 18:32:50 · 3989 阅读 · 0 评论 -
vue 通过绑定事件获取table 当前行中的id
<template> <div class="search" style="width: 500px;margin: 0 auto;text-align: center"> <table style="width: 100%"> <tr> <th>序号</th> ...原创 2019-09-06 17:56:34 · 6774 阅读 · 3 评论 -
vue路由懒加载
一、当打包构建应用时，Javascript包会变得很大，影响页面加载。二、懒加载就是将不同路由对应的组件分隔成不同的代码块，然后当路由被访问时，才加载对应的组件，这样就更高效了。三、常用的加载方式有两种：vue异步组件、ES6中的import1.没有使用懒加载，vue中的路由配置如下 import Vue from 'vue' import Rou...原创 2019-08-27 14:34:50 · 216 阅读 · 0 评论 -
vue+element-ui实现显示隐藏密码
1.第一种方法通过控制样式，还有vue的v-if 条件渲染来实现。代码如下：<template><div> <el-form> <el-form-item v-if="visible" label="密码"> <el-input type="password" v-model="formPasswo...原创 2019-08-22 11:26:18 · 6367 阅读 · 1 评论 -
基于vue监听事件实现一个简单的购物车
代码如下。详情看vue菜鸟教程监听事件https://www.runoob.com/vue2/vue-watch.html<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title>简单购物车</title> <style> #app...原创 2019-08-12 18:30:52 · 1255 阅读 · 0 评论 -
vue中用async/await 来处理异步
**用async/await ** 来处理异步先说一下async的用法，它作为一个关键字放到函数前面，用于表示函数是一个异步函数，因为async就是异步的意思， 异步函数也就意味着该函数的执行不会阻塞后面代码的执行。 写一个async 函数async function timeout() { return 'hello world';}timeout();console.log('虽...原创 2019-08-12 13:26:55 · 4052 阅读 · 0 评论 -
如何用vue+element-ui生成二维码
1.安装qrcodeelement-ui 的使用官网添加链接描述npm install qrcodejs2 --save2.页面引入<template> <div> <el-button type="primary" @click="qrCode()" style="margin-left: 20px">生成二维码</el-butto...原创 2019-08-23 17:26:17 · 7549 阅读 · 6 评论 -
VUE安装教程以及组件库的使用
一.单独VUE文件使用下载vue.js单文件，然后在html文件中引入这个文件。例如：。单独使用vue.js问题单独使用vue文件时，是在script标签中使用vue会有麻烦之处：1：组件的样式不能隔离。2：组建的模板如果写在组件对象中，则必须写成字符串格式，如果写在type=text/html的script标签中，则模板和js代码以及css代码都会分开写，不利于组件的维护。所以使用...原创 2019-08-01 18:36:03 · 1880 阅读 · 0 评论 -
vue 中自定义返回顶部组件
<template> <div id="goTop"> <div class="goTop" v-show="goTopShow" @click="goTop"><i class="goTopIcon"></i></div> </div></template><...原创 2019-08-01 18:21:32 · 388 阅读 · 0 评论