![](https://img-blog.csdnimg.cn/20201014180756928.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
VUE
文章平均质量分 59
合格的搬砖人
这个作者很懒,什么都没留下…
展开
-
谷粒商城学习日记(33)——属性分组
属性分组前端页面抽取category组件属性页面属性增加修改页面后台接口品牌tree返回修改查询属性entity返回所属品牌全路径AttrGroupController.javaCategoryService.javaCategoryServiceImpl.javaAttrGroupService.javaAttrGroupServiceImpl.javaAttrGroupEntity.java效果显示左侧品牌数右侧 属性管理联动前端页面抽取category组件首先需要抽取一个品牌树的组件vi原创 2021-04-12 23:43:33 · 338 阅读 · 0 评论 -
谷粒商城学习日记(29)——品牌管理使用逆向工程模板,以及优化
品牌管理使用逆向工程模板,以及优化使用逆向工程模板创建后台菜单使用模板优化模板brand.vuebrand-add-or-update.vue使用逆向工程模板创建后台菜单首先打开后台在菜单管理添加菜单使用模板使用product的逆向工程生成的文件brand.vuebrand-add-or-update.vue添加到vue项目src/views/modules/product优化模板状态显示组件使用switch组件brand.vue<template> <di原创 2021-04-01 22:47:04 · 186 阅读 · 0 评论 -
谷粒商城学习日记(28)——三级分类拖拽修改、批量修改、删除
三级分类拖拽修改、批量修改、删除拖拽修改(页面效果)页面效果数据收集批量修改(数据交互)前端数据传输后台代码修改批量删除拖拽修改(页面效果)页面效果首先设置el-tree的属性:draggable=“draggable”可拖拽效果绑定变量:allow-drop=“allowDrop”是否可以拖拽后放置定义方法绑定@node-drop=“handleDrop”拖拽放置后调用方法ref=“menuTree”绑定tree组件获取checkbox选中元素 <el-tree原创 2021-03-31 15:14:36 · 549 阅读 · 0 评论 -
谷粒商城学习日记(27)——三级分类添加、修改(dialog组件)
三级分类添加、修改添加修改category.vue添加和修改都需要弹出框,引入elementui的dialog组件<!-- --><template> <el-tree :data="menus" node-key="catId" :props="defaultProps" @node-click="handleNodeClick" show-checkbox :expand-on-click-node="fals原创 2021-03-30 22:06:25 · 290 阅读 · 0 评论 -
谷粒商城学习日记(22)——使用vue脚手架搭建项目
使用vue脚手架搭建项目使用vue脚手架搭建项目全局配置vue脚手架依赖初始化vue项目目录介绍初步使用设置vscode生成vue组件快捷指令路由和组件修改成简单的后台管理demo使用element-ui使用vue脚手架搭建项目全局配置vue脚手架依赖首先要确保自己的npm环境是否配置好npm config get prefix 会显示一个文件地址系统——》环境变量——》path里面添加上面显示的地址添加环境变量NPM值为上诉地址打开cmd全局执行命令打包工具下载npm install原创 2021-03-22 18:17:43 · 305 阅读 · 0 评论 -
谷粒商城学习日记(21)——Vue生命周期
Vue生命周期钩子函数生命周期函数beforeCreate()created()beforeMount()mounted()beforeUpdate()updated()activateddeactivatedbeforeDestroy()destroyed()errorCaptured() ( vue2.5+ )钩子函数生命周期示意图Vue的对象创建,渲染有这完整的生命周期代码示例<!DOCTYPE html><html lang="en"><he原创 2021-03-21 10:30:04 · 452 阅读 · 1 评论 -
谷粒商城学习日记(20)——Vue语法入门(4)
Vue语法入门计算属性和侦听器过滤器可参考文档vue官方api计算属性和侦听器格式Vue对象里面声明computed:{} 计算属性watch:{} 侦听器 new Vue({ el: "#app", data: { }, computed: { }, watch: {原创 2021-03-19 16:51:30 · 156 阅读 · 0 评论 -
谷粒商城学习日记(19)——Vue语法入门(3)
Vue语法入门v-on:事件类型v-on:type事件修饰符按键修饰符v-forv-show,v-ifv-else,v-else-ifv-on:事件类型v-on:typev-on: 可以简写成@后面跟事件类型,里面可以写函数表达式或者调用方法 <div id="app"> <!--事件中直接写js片段--> <button v-on:click="num++">点赞</button>原创 2021-03-19 15:06:48 · 153 阅读 · 0 评论 -
谷粒商城学习日记(18)——Vue语法入门(2)
Vue语法入门插值表达式与v-text,v-html插值表达式v-text,v-html单向绑定v-bind双向绑定v-model插值表达式与v-text,v-html插值表达式{{}}双大括号,里面可以取vue对象里面的值,也可以是任何的表达式,只要有返回值是方法也可以。 <div id="app"> {{msg}} {{1+1}} {{hello()}}<br/> </div> <script原创 2021-03-18 17:19:11 · 149 阅读 · 0 评论 -
谷粒商城学习日记(17)——Vue语法入门(1)
Vue语法入门创建VueDemo创建vue对象结构View-model数据动态绑定vue事件创建VueDemo创建使用vue有两种方式一种直接导出vue.js到项目,页面引入即可一种使用npm包管理的方式创建这里推荐使用第二种1.创建文件夹vueDemo打开终端控制台npm init -y初始化项目,生成了一个package.json文件,说明他是一个npm管理的项目npm install vue安装后在项目node_modules里有vue在VSCode中安装vue原创 2021-03-17 22:58:42 · 161 阅读 · 0 评论 -
谷粒商城学习日记(16)——前端代码模块化
前端代码模块化exportimport模块化就是把代码进行拆分,方便重复利用。类似于java中的导包,而JS换了个概念,是导模块。模块功能主要有两个命令构成 export 和importexport用于规定模块的对外接口import用于导入其他模块提供的功能我在html的同级建立文件夹js里面放置几个jsexportuser.js可以导出对象,属性,方法var name = "jack"var age = 21function add(a,b){ return a + b原创 2021-03-16 17:28:20 · 159 阅读 · 0 评论 -
谷粒商城学习日记(15)——ES6语法学习(4)
ES6新特性数组新方法和异步编程数组新方法异步编程之前写ajax的方式——多层嵌套Promise方式初步使用在封装数组新方法数组中新增了map和reduce方法map(callback;)<script> //数组中新增了map和reduce方法。 let arr = [1, 20, -5, 3]; //map():接收一个函数,将原数组中的所有元素用这个函数处理后放入新数组返回。 // arr = arr.map((i原创 2021-03-15 22:36:11 · 152 阅读 · 0 评论 -
谷粒商城学习日记(14)——ES6语法学习(3)
ES6语法学习(3)函数新特新函数参数默认值优化多参数方式,不定参数(数组)箭头函数,lambda表达式对象优化新特性对象的简单方法合并声明对象简写对象拓展运算符函数新特新函数参数默认值优化 <script> //在ES6以前,我们无法给一个函数参数设置默认值,只能采用变通写法: function add(a, b) { // 判断b是否为空,为空就给默认值1 b = b || 1; r原创 2021-03-14 14:22:18 · 150 阅读 · 0 评论 -
谷粒商城学习日记(13)——ES6语法学习(2)
解构表达式用法代码用法这快的逻辑比较简单,但是需要实战中记忆,这边不做过多的记录支持let arr = [1,2,3]; let [a,b,c] = arr;这种语法支持对象解析:const { name: abc, age, language } = person; 冒号代表改名字符串函数支持一个字符串为多行`` 单引号可以保留空格和换行占位符功能 ${}代码<!DOCTYPE html><html lang="en"><head> &原创 2021-03-13 14:15:50 · 142 阅读 · 0 评论 -
谷粒商城学习日记(12)——ES6语法学习(1)
let声明变量,const常量let声明变量const常量总结let声明变量<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" co原创 2021-03-13 11:46:41 · 145 阅读 · 0 评论