qq_43661408的博客

第一步：安装插件npm -i xlsx第二步：main.js 挂载插件import xlsx from "xlsx"Vue.prototype.xlsx = xlsx第三步：编写导出组件，在使用xlsx，要使用this。<template> <!-- 批量导出按钮 --> <div class="searchBox"> <el-button type="success" @click="exportExcel">导出EXCEL&

简述使用eventBus实现兄弟组件的通信，使用以下三个文件，完成两个子组件（兄弟组件）之间的通信文件名称使用情况FirstSon.vue第一个子组件，作为接收方：接收消息About.vue第二个子组件，作为发送方：发送数据默认的App.vue作为父组件调用以上两个子组件实现第一步： 创建EvenBus.js文件，并在main.js中导入该文件import Vue from 'vue'//创建一个局部的vue实例const eventbus = new

父组件传值给子组件第一步：创建子组件,定义props属性，用来监听msg变量的值的变化<template> <div class="hello"> <h1>{{ msg }}</h1> </div></template><script> export default { name: 'HelloWorld', //对父子传值没有影响 //定义props属性， props: { msg:{

第一种：创建公共模块，需要使用变量时需要import导入即可使用。第一步：创建common文件和common.jsconst serverUrl='www.global.com';export default{ serverUrl}第二步：在需要的vue文件中import公共模块<template> <div> <h1>{{global_serverUrl}}</h1> <button @click="getG

实现效果：当用户没有登录的信息时，不能访问其他的url，登录信息保存在Vuex的store.js中，登录信息持久保存。实现步骤准备vuex —> Storeimport Vue from 'vue'import Vuex from 'vuex'import createPersistedState from 'vuex-persistedstate' // 将state数据持久化，刷新以后数据也不会消失Vue.use(Vuex)/* eslint-disable no-new */

五个核心概念：state : vuex的基本数据，用来存储变量getters : 从基本数据(state)派生的数据，相当于state的计算属性mutations : 提交更新数据的方法，必须是同步的(如果需要异步使用actions)。每个 mutation 都有一个字符串的 事件类型 (type) 和 一个 回调函数 (handler)。 回调函数就是在实际进行状态更改的地方，并且它会接受 state 作为第一个参数，提交载荷作为第二个参数。actions : Action 提交的是 mutat

参考博客：大佬博客传送门实现步骤：第一步：使用的HBuilderX创建一个vue项目第二步：打开命令窗口，引入依赖 npm install -S file-saver xlsx npm install -D script-loader npm install xlsx npm i element-ui -S npm install --save vue-router第三步：创建路由 在src下创建 router目录，在router目录下创建index.jsindex.js

vuex 用处：管理全局状态（类似全局变量，每个组件都能访问到）结构：state 存放状态mutations state成员操作（修改state值唯一的方法）getters 加工state成员给外界actions 异步操作modules 模块化状态管理vuex 用法：安装：npm install vuex --save （安装vuex保存到本地）创建js文件（见下图,这里我随意命名为store.js）然后我们在main.js文件中：3.1 引入文件（根据自己的路径写）： imp