1.ref可跨页面取.vue文件的所有内容:

<!--echart图自定义公用模板-->
<echar-tem ref="echar"> </echar-tem> import echarTem from "../charts/echarts.vue"
components:{
    echarTem
}, 调用模板页面的函数:
var that = this.$refs.echar.drawBarChart();
可获取到模板页面的方法 父页面向子页面传递参数

子页面接收props:[
'option','id'],

父页面

<echar-pie :option=
'arrData' id="chartPieParent">
<div id="chartPieParent" style="width:100%; height:400px;"></div>
</echar-pie>

2.更改默认样式

<style scoped>
.block{
padding:15px 0px 0 10px;
}
.toolbar{
background: none;
}
</style>

scoped:只在本组件中作用,需要更改默认样式时:

1)去掉scoped   2)在下方再写一个style来写新样式

3.引入模板文件

1)template.vue 为模拟文件

2)user.vue为应用模板的文件 import oSelect from './template.vue';(./当前目录)

需要配置

components:{
template  //==template:template key,value值相等时可省略
},

3)在dom中直接引用<template></template>即可引用template.vue的‘所有’内容

4)如果需要再模板内添加新的内容可以再template.vue的html内容区对应位置加上<slot></slot>然后user.vue的html的对应位置即可添加新内容

vue2总结的更多相关文章

  1. vue2.0实践的一些细节

    最近用vue2.0做了个活动.做完了回头发现,好像并没有太多的技术难点,而自己好像又做了比较久...只能说效率有待提升啊...简单总结了一些比较细节的点. 1.对于一些已知肯定会有数据的模块,先用一个 ...

  2. 用FSM一键制作逐帧动画雪碧图 Vue2 + webpack

    因为工作需要要将五六十张逐帧图拼成雪碧图,网上想找到一件制作工具半天没有找到,就自己用canvas写了一个. 写成之后就再没有什么机会使用了,因此希望有人使用的时候如果遇到bug了能及时反馈给我. 最 ...

  3. vue2.0构建淘票票webapp

    项目描述 之前一直用vue1.x写项目,最近为了过渡到vue2.0,特易用vue2.0栈仿写了淘票票页面,而且加入了express作为后台服务. 前端技术栈:vue2.0 + vue-router + ...

  4. Vuex2.0+Vue2.0构建备忘录应用实践

    一.介绍Vuex Vuex 是一个专为 Vue.js 应用程序开发的状态管理模式.它采用集中式存储管理应用的所有组件的状态,并以相应的规则保证状态以一种可预测的方式发生变化,适合于构建中大型单页应用. ...

  5. 一步步构造自己的vue2.0+webpack环境

    前面vue2.0和webpack都已经有接触了些(vue.js入门,webpack入门之简单例子跑起来),现在开始学习如何构造自己的vue2.0+webpack环境. 1.首先新建一个目录vue-wk ...

  6. Vue2.0组件间数据传递

    Vue1.0组件间传递 使用$on()监听事件: 使用$emit()在它上面触发事件: 使用$dispatch()派发事件,事件沿着父链冒泡: 使用$broadcast()广播事件,事件向下传导给所有 ...

  7. 基于Vue2.0+Vue-router构建一个简单的单页应用

    爱编程爱分享,原创文章,转载请注明出处,谢谢!http://www.cnblogs.com/fozero/p/6185492.html 一.介绍 vue.js 是 目前 最火的前端框架,vue.js ...

  8. vue2.0实战

    学了几周的vue2.0,终于有时间去做一个应用了. 为了全面联系相关知识,所以用到了vue-router,以及作者最新推荐的axios,组件库用的是饿了么的mint-ui2.0. 项目构建使用官方vu ...

  9. vue DatePicker vue2.0的日期插件

    一个用vue2.0写的日期控件,可以支持简单的年月日选择.地址:https://github.com/Stevenzwzhai/vue-datepicker. 首先是关于日期对象的使用,基本就是日期的 ...

  10. vue2/vuex2的那点坑

    说是坑,其实大部分是我们自己的过错! vuex官方demo在1.0可以运行,在2.0报错?此类问题,应该很常见吧? 还有顺溜的利用1.0搭建的webpack编译环境到了vue2.0突然失效了,报错了? ...

随机推荐

  1. JVM优化-JVM参数配置

    配置方式: java [options] MainClass [arguments] options - JVM启动参数. 配置多个参数的时候,参数之间使用空格分隔. 参数命名: 常见为 -参数名 参 ...

  2. javadoc中{@link}与@see的简单使用以及区别

    因为公司的测试直接对着java api进行外部服务的测试,故最近对javadoc的要求从0变成了严重依赖,有些时候在javadoc不得不引用其他class,以便更加清晰的说明上下文以及含义,发现指向别 ...

  3. 11: python递归

    1.1 递归讲解 1.定义 1. 在函数内部,可以调用其他函数.如果一个函数在内部调用自身本身,这个函数就是递归函数. 2.递归特性 1. 必须有一个明确的结束条件 2. 每次进入更深一层递归时,问题 ...

  4. 02: CMDB设计思路

    1.1 cmdb理解   参考博客:https://www.cnblogs.com/laowenBlog/p/6825420.html   参考博客2:https://www.cnblogs.com/ ...

  5. Kali linux 2018安装后全屏乱码解决

    安装的时候选择了中文, 后来安装成功后成了全部乱码的. 原因是,系统没有中文字体显示安装包, 下载一个 sudo apt-get install ttf-wqy-zenhei 重启解决!

  6. Codeforces Round #424 (Div. 2, rated, based on VK Cup Finals) Problem F (Codeforces 831F) - 数论 - 暴力

    题目传送门 传送门I 传送门II 传送门III 题目大意 求一个满足$d\sum_{i = 1}^{n} \left \lceil \frac{a_i}{d} \right \rceil - \sum ...

  7. 【转】java提高篇之理解java的三大特性——多态

    面向对象编程有三大特性:封装.继承.多态. 封装隐藏了类的内部实现机制,可以在不影响使用的情况下改变类的内部结构,同时也保护了数据.对外界而已它的内部细节是隐藏的,暴露给外界的只是它的访问方法. 继承 ...

  8. Oracle使用——oracle用户相关操作

    前提 以dba角色登录数据库(普通用户没有操作权限):sqlplus / as sysdba 具体操作 创建用户 创建用户 使用默认表空间创建用户 create user xzgxh identifi ...

  9. 05文件合并脚本--By Mark Lutz

    ''' 合并split.py创建的目录下的所有组分文件以重建文件. 依赖文件名的排序:长度必须一致. ''' import os,sys readsize=1024 def join(fromdir, ...

  10. Spyder 调出绘图界面

    Tools->Preference->IPython console->Graphics->Graphics backend->QT4 or QT5