随笔分类 - vue入门
摘要:1.将用户信息存储到localStorage里 localStorage.setItem("user",JSON.stringify(res.data)); 2.路由守卫 //路由守卫 router.beforeEach((to,from,next)=> { if(to.path '/login')
阅读全文
摘要:{ path: '/login', name: 'login', component: login }, { path: '/', name: 'layout', component: layout, children:[ { path: '/', name: 'home', component:
阅读全文
摘要:element-ui适配于vue2,无法于vue3适配,如果使用vue2,则下载element-ui npm i element-ui -S element-ui组件网址:https://element.eleme.cn/#/zh-CN/component/installation 如果使用vue3
阅读全文
摘要:今天遇到的bug是无法将页面输入的数据传入数据库中,原因是后台未在前端寻找到id。 bug代码: saveDate(form,done){ updateInfo(form).then(res => { if (res.data.success) { this.$message({ type: "su
阅读全文
摘要:1.Element Plus 折叠按钮的应用 el-menu组件为最初框架 el-menu-item 子框架 按钮键 el-sub-menu 折叠按钮 .el-menu--horizontal > .el-menu-item:nth-child(7) { margin-right:auto; } 位
阅读全文
摘要:SpringBlade组件总览网址 https://element-plus.org/zh-CN/component/overview.html 1.element plus组件 <basic-container></basic-container>标签作用:固定整体布局 <el-table></e
阅读全文
摘要:1.前后端的下载运行与对接 SpringBlade源码下载地址https://gitee.com/smallc/SpringBlade 打开终端,事先准备好一个空文件夹 创建project文件夹 在project文件夹下创建cloud、boot、vue文件夹 进入cloud 执行git clone命
阅读全文
摘要:1.在src下新建文件夹apis 在apis下新建一个index.ts 2.在index.ts添加 import axios from 'axios'; export const httpInstance = axios.create(); 3.在终端输入 npm run lint 确定文件没有问题
阅读全文
摘要:npm install element-plus --save 下载element-plus 2.npm install -D unplugin-vue-components unplugin-auto-import 导入方式:自动导入 不需要安装插件 3.配置文件 将: import AutoIm
阅读全文
摘要:代码链接 https://www.5axxw.com/questions/simple/37xmlj 效果图展示 全屏展示
阅读全文
摘要:1.组件保持存活 正常组件用按钮切换后被切换的组件会被销毁重建,而KeepAlive标签可以保持被切换的组件不被销毁 例如:数据一被切换为新数据,切换组件后再切换回来还是新数据,若未用KeepAlive标签,切换组件后再切换回来还是数据一 2.异步组件 同步:有多个功能A/B/C时,功能运行是先运行
阅读全文
摘要:实现切换的功能 component :is="变量" 显示变量名那个组件
阅读全文
摘要:1.组件生命周期 它有八个重要时期 生命周期函数 创建期:beforeCreate created 挂载期:beforeMounte mounted 更新期:beforeUpdate updated 销毁期:beforeUnmount unmount 其中销毁期不轻易出现 2.组件生命周期的应用 一
阅读全文
摘要:1.插槽基本格式 双标签内写内容 子级页面插入标签即可 2.插槽具名 套用标签 在标签内以v-slot:自定义名/#自定义名 形式绑定子页面的标签 标签内以name="自定义名" 形式体现父级页面绑定内容 3.父级数据与子级数据同时出现在页面当中 一 在标签内用v-slot="自定义名" 二 用插槽
阅读全文
摘要:1.组件事件 形式为:父级页面中格式——引入子级页面import xx from 'url' <xx @事件名="函数名" /> 子级页面中格式——添加点击事件<button @click="自定义函数"> 自定义函数(){ //自定义事件 this.$emit("事件名","文本内容") } 2.
阅读全文
摘要:1.组件注册 全局注册:注册完后所有vue都能使用 局部注册:仅当前页面能够使用 全局注册虽然方便但有以下几个问题 一.在打包时会将它一同打包,有时候没有用到它也打包,无任何意义 二.课维护性低,在大型项目中使项目的依赖关系不明确 2.组件传递数据_props 父级传递子级数据(注意传递数据只能父传
阅读全文
摘要:组件嵌套关系 利用组件结构完成嵌套 建立以下vue 将Header.vue Main.vue Aside.vue 引入 App.vue中 Article.vue引入Main.vue,Item.vue引入Aside.vue中 Header.vue代码: <template> **<div class=
阅读全文
摘要:组件组成 组件结构 引用组件(必须写,不写子组件无法运行 页面不显示) 注入组件(必须写,不写子组件无法运行 页面不显示)
阅读全文
摘要:1.侦听器 侦听器在修改数据过程中,实时的侦听数据,将修改前数据和修改后数据记录 2.表单输入绑定 在input标签中输入v-model指令可以实时的显示input标签中输入的内容,v-model.lazy指令为不实时显示,在input标签中输入的内容用鼠标点击空白页面或ENTER后显示 3.模板引
阅读全文
摘要:1.数组变化侦测 效果图 单击push按钮后可增加其内容,直接显示在页面中 单击concat按钮后修改数组,不直接显示在页面中,将数组赋值后显示 addArrayt(){ //不引起ul自动更新 this.names.concat(["sakura"]) //若不赋值则无法显示 this.names
阅读全文