美文网首页
Vue 学习过程

Vue 学习过程

作者: 岁月静好_cd54 | 来源:发表于2019-05-17 16:34 被阅读0次

Global install

//首先安装主题工具
npm i element-theme -g


用于安装element ui,并且改变主题

//安装elementui
npm i element-ui -S
//安装sass,用于改变主题
npm i sass-loader node-sass -D
//首先安装主题工具
npm i element-theme -g
//然后安装chalk主题
npm i element-theme-chalk -D

//console
// 初始化变量文件
et -i [可以自定义变量文件,默认为element-variables.scss]

> ✔ Generator variables file

//生成的文件修改变量
$--color-primary: purple;

//console 编译
et

//main.js
import '../theme/index.css'
import ElementUI from 'element-ui'
import Vue from 'vue'

Vue.use(ElementUI)

传递事件

  1. 全局变化 vuex

  2. 子组件传递到父组件

   this.$emit("小写的时间名称",传递的参数对象{})


   @小写事件名称="父组件事件" 
   this.$on("小写的时间名称",function(参数对象){}

  1. 同级别的组件之间传递事件
// bus.js定义一个全局的变量
import Vue from 'vue'

export default new Vue()
 
//调用事件
bus.$emit('auth')

//全局监听,或者同级的组件监听
import bus from './util/bus'
bus.$on('auth', () => {
  router.push('/login')
})

相关文章

  • vue学习过程

    基础部分 实例组件指令选项模板渲染事件绑定计算属性内置动画组件交互路由数据渲染/数据同步组件化、模块化 官方工具:...

  • Vue 学习过程

    Global install 用于安装element ui,并且改变主题 传递事件 全局变化 vuex 子组件传递...

  • Framework7 Vue 学习记录

    记录项目过程中学习的Framework7 Vue组件。 Navbar Vue Component Navbar 是...

  • 从搭建vue-脚手架到掌握webpack配置(一.基础配置)

    前言 学习vue的过程肯定会接触到vue的单文件组件,进而接触到vue-cli(vue工程构建的脚手架工具),但是...

  • Vue路由的学习过程

    创建一个简单的路由 1、可以在bootcdn官网上直接下载vue-router的js文件来做练习2、新建一个htm...

  • Vue PC端框架和Vue移动端UI框架

    在学习Vue的过程之中,我发现不管是 BAT 大厂,还是创业公司,Vue 都有着广泛的应用,而且框架层出不穷,学习...

  • 2021-10-01

    在学习Vue的过程之中,发现不管是 BAT 大厂,还是创业公司,Vue 都有着广泛的应用,而且框架层出不穷,学习文...

  • Vue PC端框架和Vue移动端UI框架

    在学习Vue的过程之中,发现不管是 BAT 大厂,还是创业公司,Vue 都有着广泛的应用,而且框架层出不穷,学习文...

  • Snabbdom:虚拟DOM和Diff算法

    因为要学习Vue源码,它的diff算法是绕不过的一个知识点。学习过程中,有了解到 Snabbdom 这个库,Vue...

  • Vue学习笔记之vue-cli

    说明:学习vue时的笔记,用于理清自己在学习过程中的每个知识点的思路,若有错误,不吝赐教,谢谢。 vue-cli脚...

网友评论

      本文标题:Vue 学习过程

      本文链接:https://www.haomeiwen.com/subject/armoaqtx.html