qq_32900003的博客

原文地址

实现效果安装vue-calendar-component日历组件cnpm i vue-calendar-component --save //国内镜像引入import Calendar from "vue-calendar-component";export default { components: { Calendar },}封装<template> <div class="x-f"> <Calendar .

Vue.js是什么？Vue.js是一套构建用户界面的渐进式框架。与其他重量级框架不同的是，Vue 采用自底向上增量开发的设计。Vue 的核心库只关注视图层，并且非常容易学习，非常容易与其它库或已有项目整合。另一方面，Vue 完全有能力驱动采用单文件组件和Vue生态系统支持的库开发的复杂单页应用。Vue.js 的目标是通过尽可能简单的 API 实现响应的数据绑定和组合的视图组件。Vue.js 自身不是一个全能框架——它只聚焦于视图层。因此它非常容易学习，非常容易与其它库或已有项目整合。另一方..

computed（计算属性）是自动监听依赖值的变化，从而动态返回内容；watch（监听）是一个过程，在监听的值变化时，可以触发一个回调，并做一些事情。区别computed属性不是data中的属性值，是一个新值，初始化时使用Object.defineProperty方法挂载到vm上；而watch是监听已经存在于data中的属性 computed本质是一个惰性的观察者，具有缓存性，之后依赖的data值变化时，才会变化；watch没有缓存性，数据变化就更新 computed适合与一个数据被多个数据

生命周期钩子 详情 beforeCreate 在数据观测和初始化事件还未开始，VUE实例的挂载元素$el和数据对象都为undefined 可以进行的事件：加loading事件 created 完成数据观测，属性和方法的运算，初始化事件，$el属性还没有显示出来 可以进行的事件：结束loading，请求数据为mounted作准备 beforeMount 在挂载开始之前被调用，相关的render函数首次被调用。实例已完成以下的配置：编译模板，把d

const params = new URLSearchParams(); params.append('key', this.key); params.append('name', this.name); params.append('desc', this.desc); let _that = this; axios.post('https://tsapi.a...

安装npm install benz-amr-recorder引入 const BenzAMRRecorder = require('benz-amr-recorder')使用<template> <div class="wx-voice-div" @click="playVoice(objData)"></template>methods:{ amrPlay(amr,obj){ //播放 this.$se

安装npm install vue-video-player --save引入 import {videoPlayer} from 'vue-video-player' require('video.js/dist/video-js.css') require('vue-video-player/src/custom-theme.css')使用<video-player class="video-player vjs-custom-skin" ref="vid

安装npm install echarts -S引入// 引入基本模板const echarts = require('echarts/lib/echarts')// 引入柱状图组件require('echarts/lib/chart/bar')// 引入柱拆线组件require('echarts/lib/chart/line')// 引入提示框和title组件require('echarts/lib/component/tooltip')require('echarts/l

安装npm install vue-quill-editor -S引入 import { quillEditor } from "vue-quill-editor" import "quill/dist/quill.core.css" import "quill/dist/quill.snow.css" import "quill/dist/quill.bubble.css"使用<template> <div id="wxEditor">

Vuex -- 全局状态管理器Vuex的核心是一个store(仓库),一个‘非凡的全局对象’,store中的状态发生变化时，与之绑定的视图会被重新渲染。因为store中的状态不允许被直接修改，改变store中状态的唯一途径就是显示地提交(commit) mutation。Vuex中有5个重要的感念：State, Getter, Mutation, Action, Module。State：用于维护所有应用层的状态,并确保应用只有唯一的数据源用法:new Vuex.St...

1、 this.$router.push进行编程式路由跳转 2、 router-link 进行页面按钮式路由跳转 3、 this.$route.params获取路由传递参数 4、this.$route.query获取路由传递参数 5、 params 和 query 都是传递参数的，params不会在url上面出现，并且params参数是路由的一部分，是一定要存在的 query则是我们通常看到的url后面的跟在？后面的显示参数...

props //父组件<template> <child :content="message"></child></template><script> import child from './modal/child' export default { components: { child } }</script> //子组件

auth.jsexport function check(authority) { let userInfo = JSON.parse(sessionStorage.getItem('userInfo')); let current = userInfo ? userInfo.buttons: []; return current.some(item => authority.includes(item)); //过滤}index.jsimport {

<Table highlight-row :columns="columns3" border :data="data1" size="small" ref="table"></Table>input实现双向绑定{ title: '姓名', key: 'name', render: (h, params) => { let self = this; return h('div', [ h('Input', { .

vue中说明：this.$parent可以调用父组件的方法，但是在使用iview组件的时候会出现this.$parent找不到方法的报错 <Tabs value="uinfo" style="height: 100%;" @on-click="user_tab_chaneg"> <TabPane label="基本信息" name="uinfo"> <u-info :uid="uid" @cacel="cancel_Modal

<Button type="primary" @click="exportMoudle"><Icon type="ios-download-outline"></Icon>下载模板</Button>exportMoudle:function(){ let link = document.createElement('a'); //创建a标签 link.style.display = 'no.

https://github.com/mirari/v-viewergithub地址。1.安装配置npm install v-viewer --save2.在main.js中引入import Viewer from 'v-viewer'import 'viewerjs/dist/viewer.css' //Vue.use(Viewer) 默认配置写法Vue.use(Viewer, { defaultOptions: { zIndex: 9999 .

vue路由有 hash(浏览器环境) 、abstract(Node.js 环境)、history(Html5模式)三种方式。默认mode为hash,支持所有浏览器，缺点（url路径为有#号）history 模式，依赖后端配置，详细配置地址history 模式打包之后的本地文件，浏览器不能访问使用history模式，没有后台依赖，会出现打包放在服务器之后浏览器刷新404，跳转404等问题...

想回显label的值的，只能在option选项的value属性中绑定label值，说白了：此时的label和value属性都绑定到了真实的label，这一切仅为了手动赋值时的回显，然后用自定义click option事件代替控件自带的选中，传递参数为对象（该对象中包含了真实的label、vlaue值），需要你手动设置选中的value和label...

一、项目化 cnpm install vue-cli -g 搭建手脚架 vue --version 查看vue版本 vue init webpack ProjectName 初始化项目 cd PojectName 进入项目 ...

Html引入：https://unpkg.com/browse/vis-network@6.5.2/dist/vis-network.min.jsnpm引入：npm install vis 在关系图的页面引入vis：import Vis from ‘vis’ 在html中定义容器：<div id=”network_id”style=”height:800px”> 在scr...

安装插件：一、script引入1、在index.html文件直接引入高德地图js文件<script type="text/javascript"src="https://webapi.amap.com/maps?v=1.4.15&key=6d66ac87504c030adb1b8a0616fb8ac4"></script><!--UI组件库1....