请看如下例子: var obj = { name:"zhuwei", age:18 } function Person(data){ this.data = data; } var person = new Person(obj); console.log(person.data.age) console.log(person.age)//undefined 第一个输出的是18,第二个输出的是undefined,那现在我们希望第二个也是输出18,那应该如何实现呢, 我们可以通过Obje…
VUE中,子组件是不能直接访问父组件的数据(一般来说,当然如果你要破坏原则也是可以),如下< <body> <div id="fathercomponent"> <ul> <li v-for="item in fatherdatas">{{item}}</li> <!--父组件可以访问它自己的数据--> </ul> <child-component></chi…
混合是一种灵活的分布式复用 Vue 组件的方式.混合对象可以包含任意组件选项.以组件使用混合对象时,所有混合对象的选项将被混入该组件本身的选项.当组件和混合对象含有同名选项时,这些选项将以恰当的方式混合.比如,同名钩子函数将混合为一个数组,因此都将被调用 var mixin = { created: function () { console.log('混合对象的钩子被调用') } } new Vue({ mixins: [mixin], created: function () { conso…
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> </head> <body> <div id="app"> {{msg}} </div> <script src="vue.js">…
今天做项目,用echarts展示数据 ,自己测试 先测试 了下.写的代码html: <div ref="myChart" style="height:300px;width:100%"></div> JS methods: { drawLine() { // 基于准备好的dom,初始化echarts实例 let myChart = this.$echarts.init(this.$refs.myChart); // 绘制图表 myChart.…
1.安装axios: npm install --save axios vue-axios 2.安装qs: qs.stringify(data)可以解决data数据格式问题 npm install --save axios vue-axios qs 3.在main.js页面中引用: import Vue from 'vue' import axios from 'axios' import qs from 'qs' Vue.prototype.$http = axios Vue.prototyp…
在vue-cli项目中使用echarts -->Wangqi   这个示例使用 vue-cli 脚手架搭建 安装echarts依赖 npm install echarts -S 或者使用国内的淘宝镜像: 安装 npm install -g cnpm --registry=https://registry.npm.taobao.org 使用 cnpm install echarts -S 创建图表 全局引入 main.js // 引入echarts import echarts from 'ech…
错误 错误场景一: 错误提示: 在运行Vue项目时出现了上述错误,出现该错误的原因是Echarts的图形容器还未生成就对其进行了初始化所造成的,代码如下: // 基于准备好的dom,初始化echarts实例 var bar_dv = document.getElementById('bar_dv'); let myChart = this.$echarts.init(bar_dv) 解决办法: 1.利用Vue中的ref和$refs 来代替document.getElementById()获取该图…
1全局组件 vue框架: https://www.vue-js.com/?tab=all 组件树 solt 内置分发组件 应用见局部组件 2局部组件 2.1局部组件的使用:生子 - 挂子 - 用子 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> </head> &l…
VUE中的v-model可以实现双向绑定,但是原理是什么呢?往下看看吧 根据官方文档的解释,v-model其实是一个语法糖,它会自动的在元素或者组件上面解析为 :value="" 和 @input="", 就像下面这样 // 标准写法 <input v-model="name"> // 等价于 <input :value="name" @input="name = $event.target.val…