随笔分类 - VUE
摘要：效果： 只需要在路由配置下面添加一个children：[ {子路径}， {子路径}， {子路径}， ]
阅读全文
摘要：1.安装 如果是通过脚手架创建的项目可以勾选router选项； 通过指令在编译器的终端下载 (npm i router) vue2的项目只能使用vue3的router版本 2.配置 安装之后你的项目目录就会出现一个在src里的router.js main.js配置 router.js配置 App.v
阅读全文
摘要：不使用mapActions 和 mapMutations的代码 要用的地方字体放大了 <template> <div id="app"> <h1>当前总数为:{{nbr}}</h1> <h2>放大十倍总数为:{{bigSum}}</h2> <h3>我在{{school}}我是{{myname}}</
阅读全文
摘要：mapState: 首先要在使用sore文件的文件引入: import {mapState} from 'vuex'; 在js；红色的是用到的 mapState可以自动生成 计算属性 <script> import {mapState,mapGetters} from 'vuex'; export
阅读全文
摘要：获取bigSum <template> <div id="app"> <h1>当前总数为:{{$store.state.nbr}}</h1> <h2>放大十倍总数为:{{$store.getters.bigSum}}</h2> <select v-model.number="n"> <option
阅读全文
摘要：App.vue <div id="app"> <h1>当前总数为:{{$store.state.nbr}}</h1> <select v-model.number="n"> <option value="1">1</option> <option value="2">2</option> <opti
阅读全文
摘要：vuex是什么 概念：专门在Vue中实现集中式状态（数据）管理的一个Vue插件，对vue应用中多个组件的共享状态进行集中式的管理（读 / 写），也是一种组件间通信的方式，且适用于任意组件间通信。 什么时候使用Vuex 多个组件依赖于同一状态 来自不同组件的行为需要变更同一状态 安装 方式一 如果用脚
阅读全文
摘要：首先需要做的效果： 静态样式 <div id="app"> <h1>当前总数为:{{nbr}}</h1> <select v-model.number="n"> <option value="1">1</option> <option value="2">2</option> <option val
阅读全文
摘要：vue开发时地址栏上的ip后面会跟着一个#号，如果想去掉这个井号，可以在路由上加上 mode: 'history', 就可以去掉 //设置路由 const router = new VueRouter({ mode: "history", base: __dirname, routes: [ { p
阅读全文
摘要：axios请求 <template> <div id="app"> <button @click="getStudents">获取学生信息</button> </div> </template> <script> import axios from 'axios'; export default{
阅读全文
摘要：父组件： <propss :pos='persons'></propss> //引入子组件 import propss from './props.vue';data() { return{ inHot: true, n:0, x:1, keyWords:"", // 原始数据 persons:[
阅读全文
摘要：v-big 点击按钮X加1乘以10 <!-- 自定义函数 --> <div class=" weather "> <h2>当前n是{{x}}</h2> <h2>放大十倍的n<span v-big="x"></span></h2> <button @click="x++">点我n+1</button>
阅读全文
摘要：body： <!-- 列表过滤 --> <div class=""> <!-- 模糊查询 --> <input type="text" v-model="keyWords"> <!-- 列表渲染 --> <ul> <li v-for="item in filterPersons" :key="ite
阅读全文
摘要：<template> <view> <!-- 内容 --> <view class="content_box"> <view class="content"> <!-- 分类 --> <view class="classification"> <text @click="taskSwitch(0)"
阅读全文
摘要：一、为什么使用Vue.set() 因为受现代JS的限制，vue不能检测到对象属性的添加或删除。值必须在data对象上存在才能让vue转换它，这样它才能是响应的。 vue不允许在已经创建的实例上动态添加新的根级响应式属性，不过可以使用Vue.set()方法将响应式属性添加到嵌套的对象上。 二、Vue.
阅读全文
摘要：用到fiex弹性布局 效果：缩放时小黄圆点也跟着一起缩放 代码结构： <!-- 灰色背景 --> <div class="boxImg" ref="cont" style="position: absolute; top: 0; left: 0"> <!-- 综合监控首页 --> <img clas
阅读全文
摘要：指令的六大类 内容渲染指令 属性绑定指令 事件绑定指令 双向绑定指令 条件渲染指令 列表渲染指令 内容绑定指令 1. v-text文本指令 使用方法： 内容 'zhangsan' 就展示在p标签里 如果p标签原来有内容就会被 'zhangsan'覆盖掉 2. {{ }}插值表达式 使用方法： 在{{
阅读全文
摘要：命令：npm ui 在终端输入vue ui 进入网页 即可进行创建
阅读全文
