- 博客(25)
- 收藏
- 关注
RSS订阅原创 ajax二get post与api
文章目录ajax原生案例 get请求ajax post请求若想在页面打印出对象格式在服务器对对象转换为json格式1. 手动转换2. 自动转换API总结ajax原生案例 get请求先写一个服务器 一定要写跨域!!!const express = require("express");const app=express();app.get('/server',(req,res)=>{ // 设置响应头 设置允许跨域 res.setHeader('Access-Control-
2022-05-30 00:27:52
207
1
原创 ajax一简介
文章目录6.1.1 vue-router 的理解6.1.2 对 SPA 应用的理解6.1.3 路由的理解前提:3.多级路由（多级路由）跳转（要写完整路径）：6.1.1 vue-router 的理解vue 的一个插件库，专门用来实现 SPA 应用6.1.2 对 SPA 应用的理解单页 Web 应用（single page web application，SPA）。整个应用只有一个完整的页面。点击页面中的导航链接不会刷新页面，只会做页面的局部更新。对比 多页面应用是 点击一个链接 跳转到别的页面
2022-05-30 00:26:42
108
原创 vue十一路由
文章目录1. vue-router 的理解2. 对 SPA 应用的理解3. 路由的理解前提:3.多级路由（多级路由）跳转（要写完整路径）：1. vue-router 的理解vue 的一个插件库，专门用来实现 SPA 应用2. 对 SPA 应用的理解单页 Web 应用（single page web application，SPA）。整个应用只有一个完整的页面。点击页面中的导航链接不会刷新页面，只会做页面的局部更新。对比 多页面应用是 点击一个链接 跳转到别的页面 页面一直在刷新 跳转数据需
2022-05-30 00:24:08
108
原创 vue十vuex
文章目录Vuex过程1. 搭建环境进行调用5.getters的使用四个map方法的使用mapState方法：用于帮助我们映射state中的数据为计算属性mapGetters方法：用于帮助我们映射getters中的数据为计算属性mapActions方法mapMutations方法：用mapState 很轻松就可以两个组件之间传数据模块化+命名空间修改store.js开启命名空间后，组件中读取state数据：开启命名空间后，组件中读取getters数据：开启命名空间后，组件中调用dispatch开启命名空间后，
2022-05-30 00:22:40
135
原创 vue九插槽
文章目录插槽slot默认插槽2. 具名插槽作用域插槽也可以用来实现 子传父父组件:子组件插槽slot作用：让父组件可以向子组件指定位置插入html结构，也是一种组件间通信的方式，适用于 父组件 ===> 子组件父组件里面写子组件的标签 里面包裹别的元素子组件里面写slot 来决定插在哪分类：默认插槽、具名插槽、作用域插槽template v-slot slot-scope都用于父组件默认插槽父组件中：<Category> <div>html结构1<
2022-05-30 00:21:43
57
原创 vue九消息订阅与发布
文章目录消息订阅与发布消息订阅与发布一种组件间通信的方式，适用于任意组件间通信。使用步骤：引入: import pubsub from ‘pubsub-js’接收数据：A组件想接收数据，则在A组件中订阅消息，订阅的回调留在A组件自身。 methods: { demo(msgName,name){ alert(name); } }, mounted() { this.pubId=pubsub.subs
2022-05-30 00:20:39
63
原创 vue八全局时间总线
文章目录全局事件总线（GlobalEventBus）全局事件总线（GlobalEventBus）一种组件间通信的方式，适用于任意组件间通信。想实现一个公共组件 所有组件都可以用它来绑定事件 调用函数 所有组件都可以用它来触发事件 传递参数所有为了让所有组件都可以看到这个组件 所以让它成为 原型上的一个东西 且必须是组件(因为要用$on $emit这个是vue原型的东西 所以只有vm或者vc可以使用)让它成为谁的原型 才可以让所有组件看到 可以让它成为一个vue原型上的东西根据这
2022-05-30 00:19:50
273
原创 vue七ref,mixin,props
文章目录ref属性使用方式：props配置项mixin(混入)第一步定义混合：第二步:引入混合1. 可以全局引入 在main.js中2. 局部引入 给某一个组件 不太常用注意事项scoped样式ref属性被用来给元素或子组件注册引用信息（id的替代者）应用在html标签上获取的是真实DOM元素，应用在组件标签上是组件实例对象（vc）使用方式：打标识：<h1 ref="xxx">.....</h1>或 <School ref="xxx"></Schoo
2022-05-30 00:18:22
201
原创 vue六自定义指令
文章目录自定义指令总结：一、定义语法：(1).局部指令：(2).全局指令：二、配置对象中常用的3个回调：三、备注：自定义指令总结：一、定义语法：(1).局部指令：对象一般用于需要元素在插入页面时就实现一些操作(函数做不到) "big-number":{ //指定与元素绑定时 bind(element,binding){ element.value=binding.va
2022-05-30 00:16:57
57
原创 vue五v-show v-if
绑定样式：1. class样式写法:class=“xxx” xxx可以是字符串、对象、数组。字符串写法适用于：类名不确定，要动态获取。对象写法适用于：要绑定多个样式，个数不确定，名字也不确定。数组写法适用于：要绑定多个样式，个数确定，名字也确定，但不确定用不用。2. style样式 :style="{fontSize: xxx}"其中xxx是动态值。 :style="[a,b]"其中a、b是样式对象。样式对象值得是 fontSize这样有固定书写规范的注意v-
2022-05-30 00:15:17
244
原创 vue四watch
监视属性 watch通过通过vm对象的$watch()方法或watch属性来监视指定的属性当属性变化时, 回调函数自动调用, 在函数内部进行计算监视的属性必须存在，才能进行监视！！也可以监视计算属性监视的两种写法：(1). new Vue时传入watch配置(2). 通过vm.$watch监视监视属性和计算属性的书写格式一样 都是先写名称 在写要计算哪个属性 在写函数immediate: true,//初始化时 让handler调用一下computed: {//
2022-05-18 22:32:26
89
原创 vue四watch
监视属性 watch通过通过vm对象的$watch()方法或watch属性来监视指定的属性当属性变化时, 回调函数自动调用, 在函数内部进行计算监视的属性必须存在，才能进行监视！！也可以监视计算属性监视的两种写法：(1). new Vue时传入watch配置(2). 通过vm.$watch监视监视属性和计算属性的书写格式一样 都是先写名称 在写要计算哪个属性 在写函数immediate: true,//初始化时 让handler调用一下computed: {//
2022-05-18 21:15:12
90
原创 vue三事件绑定
事件的基本使用：1.使用v-on:xxx 或绑定事件，其中xxx是事件名；2.事件的回调需要配置在methods最终会在vm上；3.methods中配置的函数，不用使用箭头函数！否则this就不是vm了；4.methods中配置的函数，都是vue所管理的函数，this的指向组件实例对象；5.@click=“demo” 和 @click=“demo($event)” 效果一致，但后者可以传参；6.methods里的函数自动有event这个参数没有传参数 可以不写括号 也会在事件触发时被调用
2022-05-18 21:14:12
2006
原创 vue二数据绑定和mvvm
数据绑定单向数据绑定语法：v-bind:href =“xxx” 或简写为 :href =“xxx”特点：数据只能从 data 流向页面若绑定的是value 可以简写为 :value=‘’双向数据绑定指令 v-model语法：v-mode:value=“xxx” 可以简写为v-model=‘’特点：数据不仅能从 data 流向页面，还能从页面流向 data只能用在有value值的 表单类元素 如input 单选 多选————————————————关于el和data的两种写法2.1 e
2022-05-18 21:13:16
107
原创 vue学习一v-bind和v-on
1. vue引入 <!-- 路径不能写./的形式 用//的形式 --> <script type="text/javascript" src="/js/vue.js"></script></head><body> <script type="text/javascript"> Vue.config.productionTip = false; </script>2. 创
2022-05-18 21:11:54
264
原创 学习笔记十防抖节流
防抖与节流1. 防抖就是用户多次触发事件 但是只执行最后的一次2. 设置debounce函数 返回一个函数 利用闭包的思想 在外层函数设置定时器id 内层函数设置定时器 在最开始清除定时器 然后一定时间间隔执行事件 return的函数的this和event是要执行函数的 所以在外面设置变量 交给定时器内部的函调函数 改变event和this let btn = document.getElementById('btn'); function debounce(fun, dela
2022-05-18 20:57:45
91
原创 学习笔记九超时重传
promise超时重传1. 设置一个promise函数 用settimeout控制重传的过程2. 设置一个promise 函数 用try’包裹 执行fun 成功直接输出 失败catch 一次失败 没有times就全失败 catch这个错误function fun() {//封装请求执行的过程 用演示器所以用promise let n = Math.random(); return new Promise((resolve, reject) => { setTime
2022-05-18 20:54:39
224
原创 学习笔记八原型与原型链
原型函数的prototype属性每个函数都有一个prototype属性, 它默认指向一个Object空对象(即称为: 原型对象)console.log(Date.prototype, typeof Date.prototype)function Fun () { }console.log(Fun.prototype) // 默认指向一个Object空对象(没有我们的属性)date函数是定义好的 里面有很多方法 这些方法就在prototype中而fun函数是我们自己定义的 此时fu
2022-05-18 20:52:11
76
原创 学习笔记七DOM
DOM对CSS的操作读取和修改内联样式1. 使用style属性来操作元素的内联样式 - 读取内联样式： 语法：元素.style.样式名 - 例子： 元素.style.width 元素.style.height - 注意：如果样式名中带有-，则需要将样式名修改为驼峰命名法 将-去掉，然后-后的字母改大写 - 比如：background-color --> backgroundColor border-width ---> borderWidt
2022-05-18 20:49:09
69
原创 学习笔记六flex
文章目录flex弹性盒弹性容器弹性容器的属性注意！！!==6. 居中！！！==关于 align-items和align-content1. align-items2. align-content弹性元素弹性元素的属性flex的实例当用于移动端时，需要适配屏幕大小flex弹性盒代替浮动当想要成一排排列时 用flex要使用弹性盒必须先设置弹性容器弹性容器display:flex;display:inline-flex;行内弹性容器弹性容器的属性写在弹性容器里 和display在一起1.
2022-05-18 20:46:51
85
原创 学习笔记五transform
文章目录变形transform1. 平移网页的视距2. 旋转ransform:3.缩放4.变形的原点实例1实例2 旋转的立方体总结变形transform通过css改变元素的形状和位置不会影响页面布局 只动它自己1. 平移1. translateX(100px);沿着x轴平移100px > 数值可以是百分数 相当于它自己原本的位置2. translateY();沿着y轴平移3. translateZ();沿着z轴平移 > 数值越大 离我们越近属于立体效果 若要
2022-05-15 01:17:32
222
原创 学习笔记一对象扩展
文章目录属性的简洁表示法应用场景对象的属性名可以用['表达式']对象的方法Symbol属性的简洁表示法应用场景1 属性名和属性值相同2 返回一个对象 实现传递形参功能return3 在对象里放两个函数 形式更易懂例如 属性名和变量相同 用变量来代表对象中的属性值方法也可以简写const name = '张三';const age = 19;const person = { name, //等同于name:name age, // 方法也可以简写 sayN
2022-05-15 01:14:38
76
原创 学习笔记三解构赋值
文章目录解构赋值数组解构数组解构嵌套对象解构用剩余运算符对对象解构对象默认值解构赋值解构赋值是对赋值运算符的一种扩展。它通常针对数组和对象进行操作。作用：从一个大数据里提取它其中的一部分优点：代码书写简洁且易读性高注意：一般用于数组给数组赋值 对象给对象赋值（两边结构必须一样）赋值和结构必须同时进行let {a,b};{a,b}={a:12,b:13};这样会直接报错数组解构在以前，为变量赋值，只能直接指定值let a = 1;let b = 2;let c = 3;ES
2022-05-15 01:03:30
367
原创 学习笔记二数组总结
文章目录数组一、数组api二、数据遍历总结数组一、数组api数组的方法 push和unshift 都是添加 都返回新数组pop和shift都是删除 都返回删除的那个值都会改变原数组的长度数组的遍历forEach(item,index,arr)arr可以不填 若填了可以用thisfor index in 下标 for item of 数值slice(开始索引,结束索引(不包含结束那个)) 提取元素 返回一个新数组 原数组不改变splice(开始索引,删除几个)删除指定位置的元素
2022-05-15 01:00:48
60
原创 学习笔记四promise
文章目录1.Promise 的状态2. Promise对象的值catch来代替.then中的第二个函数3. promise的方法Promise.resolve 方法：Promise.resolve(value)Promise.reject 方法：Promise.reject(reason)Promise.all 方法：Promise.all(iterable)Promise.race方法：Promise.race(iterable)Promise 的几个关键问题1. 如何改变 promise 的状态？2.
2022-05-15 00:55:08
154
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人