- 博客(60)
- 收藏
- 关注
RSS订阅原创 Spring基础——AOP
AOP术语1、连接点：类里面可以被增强的方法2、切入点：实际被增强的方法3、通知（增强）：实际增强的逻辑部分。通知类型有多种：前置通知@Before、后置通知@AfterReturning、环绕通知@Around、异常通知@AfterThrowing、最终通知@After4、切面：是动作，吧通知应用到接入点过程1、Spring 框架一般都是基于 AspectJ 实现 AOP 操作（1）AspectJ 不是 Spring 组成部分，独立 AOP 框架，一般把 AspectJ 和 Spirng
2022-03-19 22:58:20
214
原创 spring基础——注解注入
Spring 针对 Bean 管理中创建对象提供注解（1）@Component（2）@Service（3）@Controller（4）@Repository配置文件1、注解注入要先引入context名称空间xmlns:context=“http://www.springframework.org/schema/context”http://www.springframework.org/schema/context http://www.springframework.org/schema/
2022-03-19 19:35:11
2595
原创 spring基础——外部引入属性文件创建bean
1、引入context名称空间xmlns:context=“http://www.springframework.org/schema/context”http://www.springframework.org/schema/context http://www.springframework.org/schema/context/spring-context.xsd2、创建属性配置文件 .properties 以 Druid 为例prop.driverClassName=com.mysql.jd
2022-03-19 15:33:07
949
原创 spring基础——＜bean＞scope属性
通过对scope属性的设置可实现单例或多例，默认不设置为单例singleton 单例（默认值）prototype 多例例如<bean id="user" class="spring.User" scope="prototype"></bean>判断是多例还是单例ApplicationContext context = new ClassPathXmlApplicationContext("bean.xml");User user1 = beanFactory.getB
2022-03-19 15:23:50
576
原创 Spring——bean生命周期
（1）通过构造器创建 bean（2）为 bean 的属性设置值（3）调用 bean 的初始化的方法（需要进行配置初始化方法，通过init-method指定初始化方法）（4）使用bean对象（5）bean销毁（需要进行配置销毁的方法，通过destroy-method指定销毁方法）例如public class Orders { private String oname; public Orders() { System.out.println("第一步，执行无参构造创
2022-03-19 15:23:33
121
原创 spring——autowire自动注入
通过指定bean标签上的autowire属性可对bean对象进行自动注入autowire = byName 根据名称注入autowire = byType 根据类型注入 当有多个bean与属性对应时会出错<bean id="dept" class="spring5.autowire.Dept"></bean><bean id="emp1" class="spring5.autowire.Emp" autowire="byName"></bean>&l
2022-03-19 15:22:59
353
原创 spring基础——普通bean xml注入
一、基本类型注入1、set注入，前提是类中声明了属性的set方法 使用\ 2、有参构造器注入，前提是类中声明了有参构造器 使用<constructor-arg name=“参数名” value=“参数值”>3、注入含特殊符号值，使用<![CDATA[<<南京>>]]> 实际值为<<南京>>4、p标签注入，需引入p名称空间 xmlns:p=“http://www.springframework.org/schema/p”<
2022-03-19 10:57:13
962
原创 微信小程序——基础
下拉刷新事件json文件{ "usingComponents": {}, "enablePullDownRefresh": true, //开启下拉刷新 "backgroundColor": "#efefef", //下拉刷新背景颜色 "backgroundTextStyle": "dark", //下拉刷新loading样式}js文件data: { count: 0},onPullDownRefresh: function () { //监听下拉刷新事件 cons
2022-03-17 20:29:51
464
原创 微信小程序 promise 化
基于回调函数的一步API的缺点默认情况下，小程序官方提供的一步API都是基于回调函数实现的，例如，网络请求的API需要有回调函数 容易造成回调地狱的问题API Promise化，指的是通过额外的配置，将官方提供的、基于回调函数的异步API，升级改造为基于Promise的异步API，从而提高代码的可读性、维护性，避免回调地狱的问题右击项目根目录 > 在终端窗口打开npm i --save miniprogram-api-promise@1.0.4重新构建npm 最好先把miniprogram_n
2022-03-17 20:29:46
729
原创 微信小程序 全局共享数据
使用mobx-miniprogram配合mobx-miniprogram-bindings实现全局数据共享其中mobx-miniprogram用来创建Store实例对象mobx-miniprogram-bindings用来包Store中的共享数据或方法，绑定到组件或页面中使用执行npm install --save mobx-miniprogram@4.13.2 mobx-miniprogram-bindings@1.2.1命令安装这两个包重新构建npm创建 store目录 在此目录下创建sto
2022-03-17 20:29:41
867
2
原创 微信小程序分包
分包的加载规则1、在小程序启动时，默认会下载主包并启动主包内页面tabBar页面需要放到主包中2、当用户进入分包内某个页面是，客户端会把对应分包下载下来，下载完成后在进行展示非tabBar页面可以按照功能的不同，划分为不同的分包之后，进行按需下载3、分包体积限制：整个小程序所有分包大小不超过16M（主包+所有分包）；单个分包/主包大小不能超过2M在app.json的pages节点中声明主包的结构，subpackages节点中声明分包的结构一个对象表示一个分包"pages":[ "pages
2022-03-17 20:29:35
485
原创 微信小程序 自定义tabBar
在app.json文件中tabBar节点"custom": true"tabBar": { "custom": true, //开启自定义tabBar "list": [{ "pagePath": "pagePath", "text": "text", "iconPath": "iconPath", "selectedIconPath": "selectedIconPath" }]},在根目录创建custom-tab-bar目录...
2022-03-17 20:29:24
175
原创 vue3响应式原理
通过Proxy（代理）：拦截对象中任意属性的变化，包括：属性值的读写、属性的添加、属性的删除等。通过Reflect（反射）：对被代理对象的属性进行操作MDN文档描述的Proxy与Reflect：Proxy：https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/ProxyReflect：https://developer.mozilla.org/zh-CN/Web/javaScript/Re.
2022-03-06 16:57:07
255
原创 vue3——ref reactive函数
ref：定义一个响应式的数据使用方法：const xxx = ref(value)修改时通过xxx.value = *** 修改例如<template> <h1>一个人的信息</h1> <h2>姓名：{{name}}</h2> <h2>年龄：{{age}}</h2> <h3>工作类型：{{job.type}}</h3> <h3>工资：{{job.salary}}
2022-03-06 16:21:59
533
原创 vue3——setup
setup是所有Composition API（组合API）“表演舞台”组件中所用到的：数据、方法等等，均要配置在setup中setup函数的两种返回值：若返回一个对象，则对象中的属性、方法，在模板中均可直接使用若返回一个渲染函数：则可以定义渲染内容 需引入import {h} from ‘vue’ （不常用）例如 import {h} from 'vue' export default { name: 'App', setup(){ let name = '啊O'
2022-03-06 14:59:46
419
原创 vue3安装
创建Vue3.0工程官方文档：https://cli.vuejs.org/zh/guide/creating-a-project.html#vue-creat1、使用vue-cli创建查看@vue/cli版本，确保@vue/cli版本在4.5.0以上vue --version安装或升级@vue/clinpm install -g @vue/cli创建vue create vue_test启动cd vue_testnpm run serve2、使用 vite 创建官方文档：htt
2022-03-06 13:59:07
118
原创 vue —— UI组件库
推荐移动端常用UI组件库1、Vant https://youzan.github.io/vant2、Cube UI https://didi.github.io/cube-ui3、Mint UI http://mint-ui.github.ioPC端常用UI组件库2、Element UI https://element.eleme.cn3、IView UI https://www.iviewui.com
2022-03-06 10:16:54
318
原创 vue——路由器的两种工作模式
hash#及其后面的内容就是hash值hash值不会包含在HTTP请求中，即：hash不会带给服务器地址永远带着#，不美观若以后将地址通过第三方手机App分享，若App校验严格，则会被标记为不合法兼容性较好history地址干净，美观兼容性和hash模式相比略差应用部署上线时需要后端人员支持，解决刷新页面服务端404的问题在创建路由器时 通过mode属性修改const router = new VueRouter({ mode: 'hash' //history route
2022-03-06 10:16:30
91
原创 vue——路由守卫
一、全局路由守卫在export路由之前配置beforeEach((to,from,next) => {})const router = new VueRouter({ routes: [ …… ]})// 全局前置路由守卫————初始化的时候被调用、每次路由切换之前被调用router.beforeEach((to,from,next) => { //to为目的路由信息 from为起始路由信息 console.log(to,from) //可在此添加一些限制条件 next(
2022-03-06 10:16:11
269
原创 vue——路由独有的生命周期函数 activated deactivated
activated：路由组件被激活时触发deactivated：路由组件失活时触发当 使用了 <keep-alive> </keep-alive>之后跳转到其他组件时，之前的组件不会被销毁 这时配置在beforeDestroy()中的方法就不会生效可能会产生资源浪费达不到想要的效果例如mounted(){ this.timmer = setInterval(()=>{ console.log('hello word') })},beforeDestroy(
2022-03-06 10:15:54
1070
原创 vue——缓存路由组件
让不展示的路由组件保持挂载，不被销毁为了预防在使用同一个 <router-view></router-view> 的情况下，路由来回跳转导致之前写的数据会被清除，其实是路由跳转后之前的组件被销毁了使用 <keep-alive>……</keep-alive> 标签包裹 <router-view></router-view> 跳转后组件不会被销毁从而数据也不会消失例如<keep-alive> <router-vi
2022-03-05 20:29:36
215
原创 vue —— 路由 replace
作用：控制路由跳转时操作浏览器历史记录的模式2、浏览器的历史记录有两种方式：分别为 push 和 replace，push是追加历史记录，replace是替换当前记录。路由跳转的时候默认：push3、开启replace模式：<router-link replace ……>……</router-link >...
2022-03-05 19:55:26
2439
原创 vue —— 路由编程试导航
可脱离<router-link :to=“url”>……</router-link>标签使用this.$router中的 push 或 replace 方法实现俩种跳转方式即：追加历史记录，覆盖顶层历史记录例如：点击按钮跳转<button @click="pushShow(message)">push查看</button><button @click="replaceShow(message)">replace查看</button&g
2022-03-05 19:54:47
84
原创 vue——路由的props
由于获取传输数据时$route.params会会多次出现，给路由配置props属性可减轻代码的编写 需要在接收参数的组件配置相应的props配置方式1、props: {key:value}routes: [ { path: 'message', component: MyMessage, children: [ { name: 'HomeMessageDetail', path: 'detail/:id/:title', component: MyDetail
2022-03-05 19:10:25
1052
原创 vue——路由命名
在嵌套很多级路由时 跳转就要编写很长的to或path给每个路由命名跳转时直接使用路由的名称即可。但是 只能用在跳转方式为对象的时候routes: [ { path: '/home', component: MyHome, children: [ { path: 'news', component: MyNews }, { path: 'message', component: MyMessage, children: [ {
2022-03-05 15:52:11
517
原创 vue——路由传参
通过query传参传参方式一：字符串传参<!-- 跳转路由并携带query参数，to的字符串写法 --><router-link :to="`/home/message/detail?id=${message.id}&title=${message.title}`"> {{message.title}}</router-link>传参方式二：对象传参<!-- 跳转路由并携带query参数，to的对象写法 --><router-l
2022-03-05 15:37:18
363
原创 vue——多级路由
配置路由时添加children属性 在children中配置子路由routes: [ { path: '/home', component: MyHome, children: [ { path: 'news', component: MyNews }, { path: 'message', component: MyMessage, }, ] },]注意子路由 路径不用写 ‘/’访问子路由时 要一级一级的写<di
2022-03-05 15:26:54
2179
原创 vue——路由router
点击页面中的导航链接不会刷新页面，只会做页面的局部更新1、安装vue-router 执行 npm i vue-router@3命令 注意版本 vue2——vue-router3；vue3——vue-router42、引入 import VueRouter from ‘vue-router’ ，应用 Vue.use(VueRouter)3、创建并暴露一个路由器// 改文件专门用于创建整个应用的路由器import VueRouter from 'vue-router'// 引入组件import
2022-03-05 14:35:02
178
原创 vue —— vuex namespaced模块化编码
在需求过多的时候就会发生在actions mutations state getters 编写代码过多的情况会很混乱，可以把每个需求的代码进行分组 查看时便可根据不同的需求查看。不过在每个需求里还是要配置actions mutations state getters使用方法 在分组时 添加 namespaced: true 开启 调用时mapState(‘分组名’, [‘属性1’, ‘属性2’, ‘属性3’,……])mapGetters(‘分组名’, [‘属性1’, ‘属性2’, ‘属性3’,…
2022-03-05 11:37:50
209
原创 vue——vuex mapState,mapGetters,mapMutations,mapActions
当多次获取state中的数据时会出现大量的 $store.state.属性名 造成代码的冗余同时也很麻烦。就可使用 mapState(引用时使用的名称,‘state中的属性名’) 或 mapState(‘state中的属性名’)第二种需要 引用时使用的名称 与 state中的属性名 相同例如computed{ //借助mapState生成计算属性 从state中获取数据（对象写法） ...mapState({Sum:'sum',Subject:'subject',……}), //借助mapSt
2022-03-05 00:52:20
180
原创 Vue —— vuex
vuex 是专门在Vue中实现集中式状态（数据）管理的一个Vue插件1、安装vuex 执行npm i vuex@3 注意版本 vue2------vuex3;vue3------vuex42、引入vuex插件import Vuex from ‘vuex’Vue.use(Vuex)例如：创建一个index.js用于声明vuex实例//引入Vueximport Vuex from 'vuex'// 引入Vueimport Vue from 'vue'//使用插件Vue.use(Vuex)
2022-03-04 23:41:52
299
原创 Vue——vue-resource
1、安装 npm i vue-resource 与axios用法相同2、引入import vueResource from 'vue-resource’插件3、使用this.$http.get(`https://api.github.com/search/users?q=${this.keyWord}`).then( response => { console.log('请求成功',response.data.items) this.$bus.$emit("updataListData
2022-03-03 23:00:15
213
原创 Vue 配置代理
npm i axios在vue.config.js文件中添加//开启代理服务器 方式一devServer: { proxy: 'http://localhost:5000'}//开启代理服务器 方式二devServer: { proxy: { '/atguigu': { //请求前缀 以此为前缀的请求都是访问外部 target: 'http://localhost:5000', pathRewrite: {'^/atguigu': ''}, //发送请求时把前缀去掉
2022-03-03 22:54:04
223
原创 Vue 自定义组件 —— slot插槽
父组件向子组件传递带数据的标签，当一个组件有不确定的结构时, 就需要使用 slot 技术，注意：插槽内容是在父组件中编译后, 再传递给子组件的。一、默认插槽<div class="category"> <h3>{{title}}分类</h3> <slot>插槽，当使用者没有传递具体介都时出现</slot> <!--声明插槽--></div><div class="container"> <
2022-03-03 21:49:50
5187
原创 vue 自定义事件
静态绑定格式 v-on:事件名=‘回调函数’ 或 @事件名=‘回调函数’动态绑定格式 借助ref属性 this.$refs.student.$on(‘事件名’,回调函数) //绑定自定义事件this.$refs.student.$once(‘事件名’,回调函数) //绑定自定义事件(只触发一次)在被标注事件的组件中声明此事件 this.$emit(‘事件名’,参数)<template> <div class="app"> <h1>{{msg}}</h1
2022-03-02 20:37:33
356
原创 vue 实现任意组件之间的通信
一、全局事件总线1、创建Vue实例时在Vue原型上绑定vue实例 Vue实例或VueComponent实例中拥有 $on、$once、$emit 而且开发过程中有且只有一个vue实例 不需要额外声明vm 或 vc实例new Vue({ el: '#app', render: h => h(App), beforeCreate() { Vue.prototype.$bus = this //将自身绑定到Vue原型作为全局总线 }})2、使用时只需要在全局总线中声明绑定事件即可se
2022-03-02 20:37:17
308
原创 Vue——过渡&动画
一、过渡使用 transition 标签 或 transition-group 标签包裹 被附加过渡动画的标签被transition 包裹的节点只能有一个根节点被transition-group 包裹的节点个数随意，但是每个节点需要添加 :key属性transition 和 transition-group 标签中的name属性用于区别各个不同动画模块 也是 css 中class的前缀；appear属性用于指定初次加载时便就执行过渡若不设置name属性默认为 v例如<transition
2022-03-01 23:02:14
278
原创 Vue——this.$nextTick()
当数据发生改变时Vue不会停止js代码的执行就去更新模板，这样就可能会导致后面对更新部分的模板无效 ，可以使用 this.$nextTick() nextTick 中的回调函数会在模板更新完成之后执行 或者 使用setTimeout() 不设置时间例如this.$nextTick(function(){ //nextTick 回调会在模板更新完成之后执行 this.$refs.inputTitle.focus()})...
2022-03-01 22:29:36
208
原创 vue 组件 插件
// 引入插件import plugins from "./plugins"// 应用插件Vue.use(plugins)编写插件export default{ install(Vue) { //参数为Vue原型 Vue.filter('myfilter',function(value){ return value.slice(0,4) }) Vue.directive("fbind",{ bind(element, binding){ element.valu
2022-02-27 21:54:43
144
原创 Vue 组件 style scoped
预防各个组件中的css样式出现相同的名称 而导致混乱。例如<style> .demo{ background-color: #ffaa00; .h { font-size: 20px; color: rosybrown; } }</style><style> .demo{ background-color: #a0ffd0; .h { font-size: 20px; color: red; } }<
2022-02-27 21:52:56
106
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人