自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+
  • 博客(24)
  • 收藏
  • 关注

原创 微信小程序获取用户信息

小程序获取用户信息和openid

2022-10-11 09:44:51 1107 1

原创 node.js用cors解决跨域问题

使用cors中间件来解决。因为cors是第三方中间件,所以首先安装 npm i cors然后在借口处引入require然后在路由之前用app.use(cors)注册cors中间件

2022-05-12 19:37:37 1501 1

原创 express路由和中间件

express路由就是客户端请求后,服务端处理函数的映射关系如创建了app=express()挂在路由 app.METHOD("url",function) method可以使get,也可以是post请求模块化路由,目的是当挂载路由很多的情况下,可以模块化,不出现冗余创建一个新的文件,引入express,然后创建一个路有对象router=express.Router()然后用router.get 或者router.post去挂载路由,最后用moudle exports router 暴露

2022-05-11 21:39:22 501

原创 express的基础使用

1首先要安装express 在终端npm i express然后导入express const express=require("express")创建一个服务器 const app=express()启动 app.listen("端口号",函数)app里有get和post两个方法app.get("url",(req,res)=>{})app/post("url",(req,res)=>{})res.send是将请求的内容发送给服务端。req.query和re

2022-05-11 19:37:18 211 1

原创 node.js模块化

暴露文件的形式有moudule.exports和直接使用exports两种方法。他们都是指向一个空对象的,所以可以在空对象里添加属性和方法,也可以重新指定一个新对象。而且后面指定的对象是可以将前面的对象覆盖的。注意:module.exports和exports他们是恒等的===,但exports最终都是指向module.exports的对象,所以一切还是以module.exports为主的,比如一个文件里有exports和module.exports两种暴露,无论module.exports在exp

2022-05-10 20:11:56 64

原创 node.js创建最基本的web服务器

首先要导入http模块const http=require("http")然后使用server=http.creatServer()创建一个server服务器设置服务器server.on()第一个参数是事件名称,第二个参数是一个回调函数,回调函数里面有两个参数,参数1是请求req,参数2是响应resreq.url可以获取请求的url地址,req.method可以获取请求的方法。res.end()是将请求的服务器内容可以响应到客户端上注意:解决中文乱码的问题,要使用res.setHea

2022-05-10 09:35:06 203

原创 node.js读取和写入文件

首先导入fs模块const fs=require("fs")读取是使用fs.readFile()方法里面有三个参数,第一个参数是读取文件的url路径,第二参数是编码格式,一般为utf8,第三个是回调函数,回调函数function()里面有两个参数,第一个参数是err,第二个参数是datastr,如果读取失败,err.message返回失败信息,datastr返回undefined,如果读取成功,err返回null,datastr返回读取的信息。写入是使用fs.writeFile()方法里

2022-05-09 11:10:50 289

原创 Vue缓存路由组件

因为每次点击切换路由组件会使之前的路由组件销毁。目的为了让之前的路由组件不销毁,则在<router-view>外面包含一个<keep-alive include:"name"><router-view></router-view></keep-alive>include里面的的name是你要不被销毁的组件name...

2022-05-08 13:28:32 401

原创 Vue编程式路由导航

学习笔记作用是不借用<router-link>来实现路由的跳转因为<router-link>有点类似于a标签实现跳转,假如使用button这些标签的话,就不能使用<router-ink>。button设置一个点击事件click,然后是在methods里去配置几个api。常用的有push replace forward back go他们5个是存在于Vue的router的原型当中,因此可以在方法中使用this.$router.push/replace()去使

2022-05-08 13:18:51 276

原创 Vue路由query传递参数

学习笔记<router-link :to="path:‘’,query:{参数1:value1,参数2:value2}}"></router-link>接受参数,{{$router.query.参数1}}to前面要用:绑定

2022-05-08 11:06:48 443

原创 Vue嵌套路由配置

在父routes里面增加一个属性children,然后是一个数组,配置一个子路由,子路由的路径path不能有/,直接写路径名.如chilidren:[path:"Student" component:Student ]然后在使用router-link时to的路径要加上父路径如<router-link to:"/School/Student"></router-link>...

2022-05-07 17:15:13 197

原创 Vue中路由的使用

学习笔记路由是运用于单页面的应用,它是一组key和value组合,key是路径,value在这里是组件,router监测路径(key)的改变,然后配置相应的组件(value)展示出来。使用步骤首先安装 npm i vue-router@3(如果使是vue2就安装这个)引入import VueRouter from "vue-router"引入后因为是插件,使用插件就是Vue.use(VueRouter)创建一个路由 const router=new VueRouter({ }),里面

2022-05-04 13:42:03 610

原创 Vuex中的4个map配置

学习笔记四个map配置分别为mapState、mapGetters、mapMutations、mapActions前两个的作用是映射state和getters的数据为计算属性后面两个是为了帮助我们生成$store.dispatch和$store.commit的函数,方便我们少写一些重复性的代码使用方法是首先要去引入import {mapState,mapGetters、mapMutations、mapActions} from "Vuex"然后在computed里使用mapState

2022-05-03 15:43:55 193

原创 Vuex学习

Vuex是Vue的一个插件,实现集中式数据管理的作用目的就是为了实现共享,多个组件依赖同一个数据。以及来自不同组件的行为对同一个数据进行改变。上图是Vue官方的工作原理图。首先State、Action和Mutations是受store管理的,而store是Vuex独有的,因此使用要先去安装Vuex,如果使用的Vue2,就是npm i vuex@3,,然后在引入进来。因为它是插件,所以使用就是Vue.use(Vuex),而...

2022-04-27 17:27:46 92

原创 Vue脚手架配置代理

学习记录假如本地浏览器域名为https://localhost:8080,请求的服务器资源域名为https://localhost:5000/data使用axios首先去终端安装axios,npm i axios然后引入 import axios from "axios"使用axios.get("https://localhost:5000/data").then(response=>{},error=>{})去获取数据是错误的这里会出先一个跨域问题。因此需要在浏

2022-04-26 12:20:26 257

原创 npm引入animate.css

首先要去你的项目里终端安装它,npm install animate.css 。安装完后就在需要的组件里引入它,因为它不是js类型,所以直接import "animate.css" 引入。引入后需要动画的<transition>中的name属性必须为name:"animate_animated animate_bounce",然后还有一个新的属性enter-active-class="xxx" 这是进入的 leave-active-class="xxx"。xxx动画效果可以去npm官网上

2022-04-25 11:43:14 1348

原创 Vue动画效果

学习笔记在Vue里添加动画效果,首先还是要在style里用css3学到的知识去设置一个动画@keyframes xxx{}需要给谁加动画,就要在元素外面包裹一个<transition></transiton>标签。在用动画的时候,Vue有专门的类名.v-enter-active{}开始的,结束的是.v-leave-active{}。注意:<transition>标签有属性,比如name属性,当你设置了name=xxx“”之后,使用动画v-enter-activ

2022-04-25 11:30:39 2201

原创 全局事件总线

学习笔记全局事件总线就是为了实现各个组件的自由通信,传递数据原理是假设有组件A和组件B,A和B之间关系可以是兄弟,父子,爷孙任意关系。然后A和B之间有一个中间商C,然后A可以在自身给C设置一个自定义事件,以及回调函数,然后加入B要给A传数据,就可以通过这个自定义事件去启动它,再后面传入数据作为参数。因此事件触发后运行回调函数,因为回调函数在A自身上,所所以A就得到了数据。条件1:中间商C是要A和B以及后续所有组件实例对象都能访问到的,因此可以将C设置在Vue.prototype.C(因为:vue

2022-04-23 20:28:20 1474

原创 解绑自定义事件

this.$off("xxx")解绑xxx自定义事件,但只能解绑一个,解绑多个里面是个数组形式this.$off(["xxx","yyy"])解绑全部事件this.$off()里面不传,有多少解绑多少

2022-04-22 16:21:59 92

原创 自定义事件的基本使用

学习笔记解决问题:子组件给父组件传递数据1.首先也可以用props方法进行实现。但在传递数据之前,父组件还是要先给子组件传递一个函数来做载体,然后子组件用props接受这个函数,然后在子组件操作使用这个函数就可以在父组件里接收到子组件的数据了。(因为函数本体是在父组件里的,子组件就拿过去接收自己的数据了,因此父组件在子组件使用后就接收到了)2.就可以通过自定义事件的方式来进行子组件给父组件传数据了。首先要给子组件绑定事件就在子组件后面使用v-on或@形式自己定义一个事件@xxx=""名字自己定义

2022-04-22 16:07:04 302

原创 插件。。。

先创建一个插件js文件plugins.js 然后在里面创建插件,export defalt {install(){ } }],然后在暴露。接着在要使用插件的js文件中import 引入 import xxx from " url"接着使用Vue.set(xxx)使用插件install()里面的第一个参数是Vue ,后面依序为传入的参数,因此可以在install(Vue) { }里面放入各种Vue的全局配置和方法。如何在main.js(所有组件汇总的js文件)中使用后,可以在子组件中直接使用...

2022-04-20 21:29:00 92

原创 mixin配置

如果两个组件要使用相同的方法或其他相同,则可以使用mixin先创建一个js文件,然后将要相同的方法或功能写进去const xxx=...,在进行暴露,需要的组件用import进行引用,然后mixins:[“xxx”]就可以使用了 可以提高复用率注意:如果混合里面有的,组件里也有,则使。用组件里的,如果组件没有,混合的也可以用。有一个例外,就是生命周期勾子里,如mounted两边都使用的话,两边都用,且混合还先用。也可以全局混合,在最终js文档里引用混合js文件,然后Vue.mixin[xxx

2022-04-20 21:15:48 234

原创 props配置对象

是一个父组件给子组件传递数据的作用。比如一个父组件使用多个子组件,但是每个子组件里面的数据是不一样的,那么就不能在子组件里给数据写死了,因此可以父组件给子组件传递变量名,比如name,age这些,方法一:然后子组件通过props这个配置项进行接受,props:["name","age"],然后子组件中使用父组件传过来的{{name}}.父组件在使用子组件的时候可以给每个子组件自行添加不同的数据 name="a" age=“b” 提醒:age因为是数值型,但这种传递只会转成字符串,因此在age前面加.

2022-04-20 21:04:33 277

原创 ref属性

在Vue中可以通过设置ID来获取元素的DOM,但Vue中有专门的属性ref来替代ID。如果是在当前组件的标签上设置ref,则它与使用id来获取DOM没什么区别。但是如果你是在父组件对子组件设置了ref,则就与区别,用id来获取子组件是一个DOM结构,比如<h1>hello world</h1>就获取这个,而使用ref则是获取子组件的实例对象VC。可以获取vc后使用VC上的属性使用格式,在父组件中用this.$ref.xxx ,xxx为你设置的ref名称...

2022-04-20 20:44:06 1086

空空如也

空空如也

TA创建的收藏夹 TA关注的收藏夹

TA关注的人

提示
确定要删除当前文章?
取消 删除