w18789476022-CSDN博客

原创 cms之day4(vue父子传值、watch；model form自定义验证、路由守卫；session、token鉴权登录)

文章目录day41. `axios ant-design vue`前端1. `vue`父子组件传值2. ` vue `之`watch`3. watch和computed区别4. ant deisgn vue使用model form时自定义验证5. 为每条`post`请求增加add_time6. 路由守卫已登录未退出不能去login7. ant deisgn vue 对话框使用2. node js应用程序生成器1. get请求带参数，前端传参2. `session负载均衡，保存至数据库`3. `使用sessi

2021-12-18 18:18:30 270

原创 cms之day3(axios 请求封装、拦截器、序列化)

文章目录day31. ` vue ant-design`前端1. 封装post、get请求2. axios 请求封装、拦截器2. qs.stringify()与JSON.stringify()序列化区别3.` transformRequest`和`transformResponse`day31. vue ant-design前端1. 封装post、get请求2. axios 请求封装、拦截器// request.jsimport axios from 'axios'import qs from

2021-12-18 18:15:27 225

原创 cms之day2(vue router子路由、debugger、mongoose返回指定字段)

day21.vue ant-design前端1. vue router子路由const routes=[ {path:"/demo1/:id",component:demo1,props:true},//props为true时，可以将动态路由的值传递给相应的组件 {path:"/demo2",component:demo2}, //{path:"/demo3",component:demo3,name:"test"},//name属性是给路由起别名，方便用js的方式去跳转

2021-12-18 18:13:38 206

原创 cms之day4( vue、ant design vue自定义验证model form、路由守卫；session与token登录鉴权)

day41. axios ant-design vue前端1. vue父子组件传值子传父// 子组件 search.vue 提交时emithandleSubmit() { // 传递name至父组件 this.$emit('searchName', this.search.name) }// 父组件 manageList.vue <search v-on:searchName="getSearchName" /> getSearchNa

2021-12-18 18:07:00 1097

原创 day3 axios拦截器、序列化

day31. vue ant-design前端1. 封装post、get请求2. axios 请求封装、拦截器// request.jsimport axios from 'axios'import qs from 'qs'const showStatus = status => { let message = '' switch (status) { case 400: message = '请求错误(400)' break case

2021-12-18 18:00:43 226

原创 cms之day2(vue子路由、debugger、mongoose)

day21.vue ant-design前端1. vue router子路由const routes=[ {path:"/demo1/:id",component:demo1,props:true},//props为true时，可以将动态路由的值传递给相应的组件 {path:"/demo2",component:demo2}, //{path:"/demo3",component:demo3,name:"test"},//name属性是给路由起别名，方便用js的方式去跳转

2021-12-18 17:58:59 87

原创 axios node vue express

文章目录day11. `vue cli` 与`ant design vue`之前端建设1. `vue cli`项目搭建2. 使用`ant deisign vue``3. axios is not defined`4.` localhost 8080`接口访问`3000`后台，因为端口不同，同源协议生效，导致报错。5.` axios`传参`post`后台接收不到，前端修改如下，后台通过`req.query`获取6. 路由`router`使用`7.Cannot read property ‘$router‘ o

2021-12-18 17:57:21 551

原创 vue axios node.js ---＞cms

文章目录day11. `vue cli` 与`ant design vue`之前端建设1. `vue cli`项目搭建2. 使用`ant deisign vue``3. axios is not defined`4.` localhost 8080`接口访问`3000`后台，因为端口不同，同源协议生效，导致报错。5.` axios`传参`post`后台接收不到，前端修改如下，后台通过`req.query`获取6. 路由`router`使用`7.Cannot read property ‘$router‘ o

2021-12-16 21:23:27 188

原创 cms之day1(mongoose、express、vue、axios)

文章目录day1`1. vue cli 与ant design vue之前端建设``1. vue cli项目搭建``2. 使用ant deisign vue``3. axios is not defined``4. localhost 8080接口访问3000后台，因为端口不同，同源协议生效，导致报错。``5. axios传参post后台接收不到，前端修改如下，后台通过req.query获取``6. 路由router使用``2. npm 应用程序生成器之后台开发``1. 应用程序生成器``2. app.js

2021-12-14 17:58:14 911

原创时间戳转标准时间

function formatDate(date, str) { var yyyy,yy,M,MM,d,dd,h,hh,mm,m,ss,s,w; yyyy = date.getFullYear().toString(); //2014 yy = yyyy.slice(2); //14 M = (Number(date.getMonth()) + 1).toString() //9 MM = 0 + M; //09 d = (Number(date.getDa.

2021-04-19 16:54:32 91

原创只能输入{} [] ()三种符号，判断字符串是否符合标准，否则则计算其权重之和

function getMatchBracketsNum(inString, inStringNum) { var s = []; if (inStringNum % 2 !== 0) { return -1; } else { for (var i of inString) { //查看inString是否存在其他符号 if (i === '[' || ']' || '(' || ')' || '{'.

2021-04-19 15:34:34 116

原创数组去重的两种方法（包括NaN去重）

（1）for循环function delArr(arr) { var nan = []; for (var i = 0; i < arr.length; i++) { var temp = arr[i]; if (typeof temp === 'number' && isNaN(temp)) { nan.push(temp); //删除多余的NaN judg

2021-04-19 15:33:03 322

原创 npm run build --report不生成分析图

使用以上两种方法也不行，但是我发现修改完package.json后，在dist里增加了一个report.html，Alt+B进行打开，就是想要的分析图啦

2021-04-09 16:30:07 224

原创路由懒加载（一般用于外层路由）

目的：当点击相关的页面的时候，才去后台请求该路由部分代码（路由懒加载）。而路由组件缓存是将组件对象从浏览器缓存至内存1. 打包为生产环境：npm run build2. 路由懒加载：（此处以home.vue为例）3. 在router里的index.js里：// 路由器对象模块import Vue from 'vue'import VueRouter from 'vue-router'// import Home from '../pages/Home/Home.vue'Vue

2021-04-09 10:16:06 183

原创缓存路由组件，路由跳转（直接返回主页面）

目的：在切换路由的时候，数据都是重新获取的，为提升用户体验，使用缓存路由组件对象。在router-view的外层包裹keep-alive <keep-alive> <router-view></router-view> </keep-alive>效果:当你在一个路由组件里滑动到某处页面，点击其他路由页面，再返回时，页面还是停留在之前的位置。...

2021-04-09 09:32:03 317

原创 vue从后台中获取数据

1. 在接口函数中定义（api/index.js）： export const reqShopList=({geohash,keyword})=>ajax(base_url+'/search_shops',{geohash, keyword})2.在mutation-type里定义：export const RECEIVE_SEARCH_SHOPS='receive_search_shops'//接收搜索的商家数组3. 在mutation里：[RECEIVE_SEAR.

2021-04-09 07:58:18 2292

原创 $attrs实现组件间传值

$attrs实现组件间传值1.目标：在ShopRating.vue中存在从vuex中获取的评分值，现在需要根据评分值实现对Star组件里星星个数的控制。2. 评分控制星星个数的思想： starNum(score) { let fullStar = ""; let empityFullStar = 0; fullStar= parseInt(score); // 判断分数的小数部分是否小于5： <=5 小数部分被去除 ..

2021-04-08 15:56:18 220

原创 vue/no-side-effects-in-computed-properties

Unexpected side effect in “listShow” computed property vue/no-side-effects-in-computed-properties解决computed中不可修改data中的值

2021-04-07 19:49:12 362

原创 EcmaScript6复习

1.let(1)let只在代码块内有效;(2)let只可声明一次;(3)let不存在变量提升。2.const(1)其是一个常量，必须初始化;(2)常量值一旦声明，不可修改。

2021-04-07 15:49:41 70

原创 vue中阻止事件冒泡

目的：外层div的点击不会触发内层@click被触发。在内层的@click修改为@click.stop="updateFoodCount()"其可以阻止事件冒泡

2021-04-06 19:39:45 83

原创父组件中调用子组件的方法

父组件中调用子组件的方法简述：在子组件Food.vue中存在toggleShow（）这个方法，用以控制子组件的显示。目的是在父组件ShopGoods.vue里调用该方法。前提假设您已设置二者为父子组件。1. 在父组件中所自定义的标签中为其添加ref绑定： <food :food="food" ref="food"></food>2. 在父组件中需要该方法的地方输入以下代码，即可实现子组件方法的调用。 this.$ref.food.toggleShow();

2021-04-06 17:16:14 197 1

原创子组件里使用父组件里的数据

子组件里使用父组件里的数据1. 明确父子组件：ShopGoods.vue为父组件；CartControl.vue为子组件。2. 目的：在父组件里有来自数据库的food,想要在子组件中使用food中的数据。3. 复习一下子组件的创建以及在父组件中的使用： 1. 创建子组件（eg. CartControl.vue） 2. 在父组件里import子组件：import CartControl from '../../../components/CartControl/CartCon...

2021-04-06 17:07:50 335

原创 mounted中的dispatch与computed中的state

记录代码在vuex中的操作1. 当在mounted中输入以下代码时,相当于传值给vuex的mutation改变statemounted() { // 在vuex中的state中可以看到数据 this.$store.dispatch("getShopGoods"); },2. 想要读取vuex中state的数据时： computed: { // 从vue中的组件中可以看到 goods() { return this.$store.

2021-04-05 15:36:31 320

原创 vue中使用双层v-for获取数据（vuex）

vue中使用双层v-for获取数据即遍历goods中的foods <ul> <li v-for="(good, index) in goods" :key="index"> <p class="discount">{{ good.name }}</p> <ul > <li > <div class="disco

2021-04-05 15:29:54 879

原创图片自适应父元素

功能：1. 图片适应父元素但不会导致像素模糊（此处是录屏软件较差原因哈）；2. 可以调节图片显示在父元素中的位置。在父元素里设置： width: 100%; height: 60px; background-image: url("https://c-ssl.duitang.com/uploads/item/202004/18/20200418143019_xwhhv.thumb.1000_0.gif"); background-size: cover;

2021-03-31 21:35:29 289

转载 Bootstrap所有可用类名总结

Bootstrap所有可用类名总结：https://blog.csdn.net/Super___Boy/article/details/101526552?utm_term=bootstrap%E4%B8%AD%E6%89%80%E6%9C%89%E7%B1%BB%E5%90%8D&utm_medium=distribute.pc_aggpage_search_result.none-task-blog-2~all~sobaiduweb~default-4-101526552&spm=3

2021-03-31 21:10:15 637

原创 vue-cli3里使用less

运行该行命令：vue add style-resources-loader安装成功在vue.config.js里修改如下代码：pluginOptions: { 'style-resources-loader': { preProcessor: 'less', patterns: [ //这个是加上自己的路径， //注意：试过不能使用别名路径 path.resolve(__dir..

2021-03-23 21:08:29 528

原创 jQuery从入门到精通

目录1. 初识jQuery1.1 What？1.2Why?1.3How?2. jQuery的2把利器2.1jQuery核心函数2.2. jQuery核心对象（通过.调用内部的方法）3. 使用jQuery核心函数4. 使用jQuery对象5. jQuery插件6. 练习1. 初识jQueryCRUD：增删改查（create、read、update、delete）。 Write less,do more。1.1 What？h...

2021-01-22 12:18:27 693

原创初识jQuery

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>初识jQuery</title>  <script&.

2020-12-14 19:25:50 53

原创学习经验

1.python库安装位置C:\Users\26706\AppData\Local\Programs\Python\Python39\Lib\site-packages2. pip永久加速方法在user文件夹里新建pip文件夹，再建pip.ini 例如C:/用户/XXXX/pip/pip.ini，写入：[global] index-url = https://pypi.tuna.tsinghua.edu.cn/simple/ [install] trusted-host=pyp

2020-12-14 11:18:36 276 1

原创 HTML5与CSS3及Less

软件软件的分类系统软件：Windows、Linux、macOS.应用软件：office、qq游戏软件：王者荣耀软件的组成通常情况下，现在的软件由两个部分组成：客户端：用户通过客户端来使用软件。客户端的形式：（1）文字客户端：古老的方式，通过命令行来使用软件。（2）图形化界面：通过点击拖动等来使用软件。（3）网页：通过访问网页来使用软件。所有的网站都属于这个范畴。（B/S架构：Browser/Sever）网页的特点：相较于传统的图形化界面，网页具有如下一些优点：不需要安装；无需

2020-11-21 10:49:13 719

原创弹性盒练习

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <link rel="stylesheet" href="../../c

2020-11-19 09:37:09 287

原创京东导航栏

未解决问题：此处显示省份的div的上边框应部分掩盖。<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <link re

2020-11-14 09:00:56 411

原创 Font-Awesome-master

链接密码ck12

2020-11-12 16:30:48 72

原创通过z-index实现图片轮播

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <link rel="stylesheet" href="../../c

2020-11-12 10:32:26 346

原创 reset.css

/* http://meyerweb.com/eric/tools/css/reset/ *//* v1.0 | 20080212 */html, body, div, span, applet, object, iframe,h1, h2, h3, h4, h5, h6, p, blockquote, pre,a, abbr, acronym, address, big, cite, code,del, dfn, em, font, img, ins, kbd, q, s, samp,sma

2020-11-08 19:34:22 170

原创 JavaScript学习笔记

JavaScript学习笔记JavascriptJS编写的位置输出语法基本语法字面量与变量字面量变量标识符数据类型六种数据类型1.String字符串2.Number数值3.Boolean布尔值4.Null空值5.Undefined 未定义引用数据类型类型转换转换为String方式一（强制类型转换）方式二（强制类型转换）方式三（隐式的类型转换）转换为Number方式一（强制类型转换）方式二（强制类型转换）方式三（隐式的类型转换）转换为布尔值方式一（强制类型

2020-11-07 09:47:55 607

原创 move()函数

/* *目前我们定时器的标识由全局变量timer保存 * 所有的执行正在执行的定时器都在这个变量中保存 *///var timer;//乌龟与兔子使用同一个定时器/* *尝试创建一个可以简单动画的函数 * 参数 obj要执行动画的对象 * target:执行动画的目标位置 * speed：移动的速度 * attr:要执行动画的样式，比如left,right * callback:回调函数，在动画执行完毕后执行 */function move(obj, attr,

2020-11-07 09:08:18 2822

原创按钮控制div移动方向

<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> <style type="text/css"> * { margin: 0; padding: 0; } #box1 { width: 6.25rem; height: 6.25rem; background-col

2020-11-06 19:28:05 735

原创键盘控制div移动

<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> <style type="text/css"> #box1 { width: 200px; height: 200px; background-color: #FF7F50; position: absolute; } <

2020-11-06 19:26:53 110

snakeyaml-1.26.jar

空空如也