MW

【代码】HTML+CSS实现时间轴效果。

JavaScript 生成随机颜色。

vue 按钮防止重复提交

vue页面同时适配手机端和PC端

靠过滤器全代码第二种全局过滤器在项目main.js中引用全局过滤器页面直接使用

1.多个vue-element-admin 项目部署到同一台服务器的nginx里面2.我们需要修改vue.config.js里面的publicPath原来的配置 publicPath: '/',指定的目录的配置 publicPath: process.env.NODE_ENV === 'production' ? '/gong' : '/',gong 就是指定的目录3.放到服务器指定目录中...

1.在store文件下的index.js 文件下定义变量import Vue from 'vue'import Vuex from 'vuex'Vue.use(Vuex)// 定义Mutationexport default new Vuex.Store({ state: { count:0, color:'red' }, mutations: { // 改变颜色 nge(state,step){ state.color=step

var problems = [] const problem1 = { problemUuid: 1, voteState: 2 } const problem2 = { problemUuid: 2, voteState: 1 } const problem3 = { problemUuid: 2, voteState: 2 } // 过滤 /** * @param {Object} 新数组

var entityList = [ { formatDate: "2021-01", nums: 0 }, { formatDate: "2021-02", nums: 0 }, { formatDate: "2021-03", nums: 0 }, { formatDate: "2021-04", nums: 0 }, { formatDate

1.安装qrcodejs2cnpm i qrcodejs2 --save 或者npm i qrcodejs2 --save 2.在需要用的页面中引入 <div id="qrcode" ref="qrcode"></div>3.methods 方法中使用qrcode () { let qrcode = new QRCode("qrcode", { width: 200, // 二维码宽度，单位像素 height: 20

一、组件之间共享数据的方式父向子传值：v-bind子向父传值：v-on兄弟组件之间传值：EventBus二、Vuex是什么vuex 是一个专为 Vue.js 应用程序开发的状态管理模式。它采用集中式存储管理应用的所有组件的状态，并以相应的规则保证状态以一种可预测的方式发生变化。Vuex 也集成到 Vue 的官方调试工具 devtools extension (opens new window)，提供了诸如零配置的 time-travel 调试、状态快照导入导出等高级调试功能。**简单来说：**V

使用element组件库里面的Table 表格，遇到某一个字段内容过多，导致td高度被撑开，布局显得很不美观比如：只要给table-cloumn添加一个属性show-overflow-tooltip就可以了 <el-table-column prop="Content" label="内容" width="180"

ECharts基础配置option主要的配置有：series系列图标配置，它决定着显示那种类型的图表xAxis设置x轴yAxis-设置y轴grid直角坐标系内绘图网格tooltip图表的提示框组件title设置图标的标题legend图例组件color调色盘颜色列表toolbox-工具箱组件，可以另存为图片等功能详细请看官网：https://echarts.apache.org/zh/option.html#title

常见的数据可视化库D3.js 是最流行的可视化库之一，它被很多其他的表格插件所使用。它允许绑定任意数据到DOM，然后将数据驱动转换应用到Document中。你可以使用它用一个数组创建基本的HTML表格，或是利用它的流体过度和交互，用相似的数据创建惊人的SVG条形图。ECharts 一个使用 JavaScript 实现的开源可视化库，可以流畅的运行在 PC 和移动设备上，兼容当前绝大部分浏览器（IE8/9/10/11，Chrome，Firefox，Safari等），底层依赖矢量图形库 ZRender，

axios请求方法：get，post，put，patch，deleteget：获取数据post：提交数据（表单提交+文件上传）put：更新数据（所有数据推送到后端）patch：更新数据（只将修改的数据推送到后端）delete：删除数据...

第一步创建一个vue项目，名字叫axios-vuevue create axios-vue第二步先不要急着启动项目，cd 进入到项目中输入cnpm add axios第三步启动项目npm run serve第四步在你views文件中的Home.vue配置一下import axios from 'axios'created() { axios.get('/data.js...

Axios 是什么    Axios 是一个基于promise的HTTP库    可以用于浏览器和node.jsAxios有哪些特性    支持Promise APl    取消请求   &nbsp...

wathc 监听器虽然计算属性在大多数情况下更合适，但有时也需要一个自定义的侦听器。这就是为什么 Vue 通过 watch 选项提供了一个更通用的方法，来响应数据的变化。当需要在数据变化时执行异步或开销较大的操作时，这个方式是最有用的。直接上代码<div> watch 用法 <br/> {{answer}} <input type="text" v-model="answer"></div>export defa

动态路由在router文件中先定义路由import Vue from 'vue'import VueRouter from 'vue-router'//主页import Home from '../views/Home'//详情import Detail from "@/views/Detail/Detail";Vue.use(VueRouter) //注册模块const routes = [ { path:'/', redirect:'/home'// 重定向

在router路由里面配置const routes = [ { path:'/', redirect:'/home'// 重定向 }, { path: '/home', component:Home, //嵌套路由 children: [ { path:'nowplaying', component:Nowplaying }, { path:'comingsoon

1.用vue可视化页面创建项目window+R cmd输入vue ui2.安装Element插件,并且去项目中配置然后在你的vue项目中的mian.js中加入三句话就行了// 手动配置element-uiimport ElementUI from 'element-ui'import 'element-ui/lib/theme-chalk/index.css'Vue.use(ElementUI)3.配置axios库去mian.js中加入两句话就行了...

产生原因新版的webpack-dev-server增加了安全验证，默认检查hostname，如果hostname不是配置内的，将中断访问。解决方案在根目录下创建文件vue.config.js，然后填入如下内容disableHostCheck: true,...

第一步需要下载 axioscnpm install --save axios里面的内容module.exports = { devServer: { proxy: { '/ajax': { target: 'http://m.maoyan.com', /* ws: true,*...

单个文件组件基于Vue CLl脚手架 把App.vue全部内容删了换成下面的<template> <div> <h1>MW</h1> <input type="text" ref="mytext"> <button @click="handleAdd">添加</button> ...

就两步第一步最好执行自动修复错误代码（比如少一个空格）npm run lint第二步打包npm run build最后会生成一个dist的目录 那个里面就是我们写好的，最后后台需要就直接拿去用...

Vue CLI 是一个基于 Vue.js 进行快速开发的完整系统，提供：通过 @vue/cli 搭建交互式的项目脚手架。通过 @vue/cli + @vue/cli-service-global 快速开始零配置原型开发。一个运行时依赖 (@vue/cli-service)，该依赖：可升级；基于 webpack 构建，并带有合理的默认配置；可以通过项目内的配置文件进行配置；可以通过插件...

第一步需要去把原来的项目中引用新的 组合式 API,我参考的是vue的GitHubhttps://github.com/vuejs/composition-api/blob/master/README.zh-CN.mdnpm install @vue/composition-api验证是否成功可以去项目中package.json文件中看是否加入了这个 "@vue/composition-api": "^1.0.0-beta.19",然后去main.js文件中加入import Vue

第一步需要在项目中加入.prettierrc文件{ "semi": false, "singleQuote": true}第二步在.eslintrc.js加入 'space-before-function-paren': 0

指令用法<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Vue-指令用法</title> <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js...

Vue transition过渡   Vue在插入、更新或者移除DOM时，提供多种不同方式的应用过渡效果。（1）单元素/组件过渡         css过渡         css动...

slot插槽（内容分发）单个slotb具名slot*混合父组件的内容与子组件自己的模板–>内容分发*父组件模板的内容在父组件作用域内编译；子组件模板的内容在子组件作用域内编译。...

知识点<component> 元素，动态地绑定多个组件到它的is 属性<keep-alive> 保留状态，避免重新渲染上代码 <!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Vue 动态组件<...

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Vue 非父子通信</title> <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"&gt...

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Vue-ref 通信</title> <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"&g...

Vue 子传父<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Vue 子传父</title> <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue....

废话不多说上代码<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Vue父传子</title> <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue....

废话不多说直接上代码<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Vue定义组件</title> <script src="https://cdn.jsdelivr.net/npm/vue/dist/v...

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Vue购物车</title> <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js">&l...

废话不多说上代码<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Vue表单控件绑定</title> <script src="https://cdn.jsdelivr.net/npm/vue/dist/v...

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Vue事件处理器</title> <!-- 开发环境版本，包含了有帮助的命令行警告 --> <script src="https://cd...