Human0722's blog Human0722's blog
首页
  • Spring

    • Spring Framework
    • Spring Boot
    • Spring Cloud
  • CCNA
  • Vue

    • Vue2
日本语
导航
  • 分类
  • 标签
  • 归档
GitHub (opens new window)

Human0722

Gravity always win
首页
  • Spring

    • Spring Framework
    • Spring Boot
    • Spring Cloud
  • CCNA
  • Vue

    • Vue2
日本语
导航
  • 分类
  • 标签
  • 归档
GitHub (opens new window)
  • Vue2

    • vue-cli搭建vue项目基础框架。
      • Vue对象
        • 计算属性
          • class 与 style 的绑定
            • 常见的数组操作函数
              • v-click 事件
                • 表单与 v-model
                  • 组件相关
                    • 父组件通过 props 传值
                    • 子组件向父组件通信
                    • 非父子组件通信
                    • slot 插槽
                  • Vue-router
                    • Vuex
                      • 最佳实践
                      • JS
                      • Vue
                      Xueliang
                      2022-05-06
                      目录

                      Vue2

                      Vue.js笔记本

                      # vue-cli搭建vue项目基础框架。

                      1. 安装vue
                      npm install -g @vue/cli
                      yarn global add @vue/cli
                      
                      1
                      2
                      1. 创建项目
                      vue create my-project
                      ||
                      vue ui
                      
                      1
                      2
                      3

                      # Vue对象

                      <script>
                        var app = new Vue({
                          el: '#app', // 绑定容器
                          data(): {   // 渲染的数据
                            return {
                              name: 'vue-project'
                            }
                          }
                          methods: {  // 方法s
                      
                          },
                          computed: {
                            prices: function() {
                              return 1+2;
                            }
                          },
                          props: ['name'], // 接受属性值
                      
                          filters: {    // 格式化数据
                            formateDate: function (value) {
                              return 'value:' + value;
                            }
                          },
                          mounted: {  //挂载前调用
                      
                          },
                          beforeDestory: {  // 销毁前调用
                      
                          }
                      
                        });
                      </script>
                      
                      1
                      2
                      3
                      4
                      5
                      6
                      7
                      8
                      9
                      10
                      11
                      12
                      13
                      14
                      15
                      16
                      17
                      18
                      19
                      20
                      21
                      22
                      23
                      24
                      25
                      26
                      27
                      28
                      29
                      30
                      31
                      32

                      # 计算属性

                      完成各种复杂逻辑操作,操作数据后返回一个结果。只要所操作数中的任一个被触发,就会重新执行计算属性。每个计算属性包含一个 getter 和 setter。修改数据触发 setter, 读取数据出发 getter。

                      <div>{% raw %}
                        {{ prices }}
                      {% endraw %}</div>
                      var app = new Vue({
                        el: '#app',
                        computed: {
                          prices: function () {
                            return 1+2;
                          }
                        }
                      });
                      
                      1
                      2
                      3
                      4
                      5
                      6
                      7
                      8
                      9
                      10
                      11

                      计算属性和方法的区别就是: 计算属性有缓存,只有所依赖数据被改动则重新计算。而 methods 中的方法,只要是重新渲染就会被调用。选择取决于是否需要缓存~

                      # class 与 style 的绑定

                      常用的绑定样式的方法: 在标签上使用对象语法、数组语法快速绑定多个样式、内联样式

                      // 对象语法
                      <div :class="{'active': isActive', 'border': isBorder}">Content</div>
                      new Vue({
                        ...
                        data() {
                          return {
                            isActive: true,
                            isBorder: true
                          }
                        }
                      });
                      
                      // 数组语法快速绑定多个样式
                      <div :class="[isActive, isBorder]">Content</div>
                      new Vue({
                        ...
                        data(): {
                          return {
                            isActive: 'active',
                            isBorder: 'border',
                          }
                        }
                      });
                      
                      // 通过计算属性绑定
                      <div :class="classes">Content</div>
                      new Vue({
                        ...
                        computed: {
                          classes: function() {
                            return {
                              'active': true,
                              'border': this.isBorder
                            }
                          }
                        }
                      });
                      
                      // 通过内联样式
                      <div :style="{ 'color': color, 'fontSize': fontSize + 'px'}">Content</div>
                      new Vue({
                        ...
                        data() {
                          return {
                            color: 'red',
                            fontSize: 14
                          }
                        }
                      });
                      
                      1
                      2
                      3
                      4
                      5
                      6
                      7
                      8
                      9
                      10
                      11
                      12
                      13
                      14
                      15
                      16
                      17
                      18
                      19
                      20
                      21
                      22
                      23
                      24
                      25
                      26
                      27
                      28
                      29
                      30
                      31
                      32
                      33
                      34
                      35
                      36
                      37
                      38
                      39
                      40
                      41
                      42
                      43
                      44
                      45
                      46
                      47
                      48
                      49

                      # 常见的数组操作函数

                      push pop shift unshift splice sort replace

                      this.books.push({'xx': 'xx'});  //向数组 books 末尾追加
                      this.books.pop(); // 从数组 books 末尾弹出
                      this.books.shift(); // 从数组 books 头部弹出
                      this.books.unshift({'xx': 'xx'}); // 向数组 books 头部添加元素
                      this.books.splice(index, len, [item]);  //
                        splice(1,1); // 删除第二个元素
                        splice(1,1,'ttt');  // 替换第二个元素
                        splice(1,0, 'ttt'); // 在第二个位置添加元素
                      this.books.sort();    // 神仙语法糖,还没搞懂
                      this.books.reverse(); // 将数组反转
                      
                      1
                      2
                      3
                      4
                      5
                      6
                      7
                      8
                      9
                      10

                      # v-click 事件

                      // 简写
                      <button @click="xxx">按钮</button>   // 调用方法,计算属性...
                      <button @click="var++">按钮</button>  //直接执行 js 语句
                      
                      // 传入参数
                      <button @click="xxx(10)">Button</button>
                      // 传入元素本身
                      <button @click="xxx(10,$event)"></button>
                      new Vue({
                        ...
                        xxx(num, event) {
                          event.preventDefault();
                        }
                      });
                      
                      // 一些快捷修饰符: stop prevent, capture, self, once
                      <a @click.stop="handle"></a>    // 阻住默认跳转事件
                      <form @submit.prevent="handle"></form>    // 阻止表单默认提交事件
                      <input @keyup.enter="handle"></form>
                      
                      1
                      2
                      3
                      4
                      5
                      6
                      7
                      8
                      9
                      10
                      11
                      12
                      13
                      14
                      15
                      16
                      17
                      18
                      19

                      # 表单与 v-model

                      <input type="text" v-model.lazy="xxx">  // lost focus才会更新数据
                      <input type="text" v-model.number="xxx"> // 保存为数而非字符串
                      <input type="text" v-model.trim="xxx">  // 去除首尾的空格
                      
                      1
                      2
                      3

                      # 组件相关

                      # 父组件通过 props 传值

                      1.传递一个字符串

                      // 父组件
                      <my-component name="myName"></my-component>
                      ...
                      new Vue({
                        component: {
                          my-componet: require('./component/xxxComponent.vue').default;
                        }
                      });
                      
                      // 子组件中:
                      {% raw %}
                      <div>{{ name }}</div>
                      {% endraw %}
                      ...
                      export default{
                        props: ['name']
                      };
                      
                      
                      1
                      2
                      3
                      4
                      5
                      6
                      7
                      8
                      9
                      10
                      11
                      12
                      13
                      14
                      15
                      16
                      17
                      18

                      2.传递一个对象

                      只要在父组件中属性名前面家上 : 即可。

                      <my-component :message="{name: 'xxx'}"></my-component>
                      
                      1

                      3.一些数据流 当父组件传递属性值的时候,值会先存储在 props 列表中。此时的数据只能读,不能修改。 如果数据是需要频繁修改的属性,则用 data(){} 转存,再操作 data 中的数据即可。 data 中的数据名称可以和 props 中的同名, 在末班中访问的时候会优先访问 data 中的数据。

                      // location: 子组件
                      <h3>{{ name }} </name>
                      export default{
                        props: ['name'],
                        data() {
                          return {
                            name: this.name
                          }
                        }
                      }
                      
                      1
                      2
                      3
                      4
                      5
                      6
                      7
                      8
                      9
                      10

                      如果数据是需要处理一次使用而无需多次更改, 这里使用 computed 来处理 props 属性值。但是 computed 属性名不能和 props 相同。

                      // location: 子组件
                      export default {
                        props: ['width'],
                        computed: {
                          style: function() {
                            return {
                              width: this.width + 'px'
                            }
                          }
                        }
                      }
                      
                      1
                      2
                      3
                      4
                      5
                      6
                      7
                      8
                      9
                      10
                      11

                      4.数据过滤

                      主要是严格约束来自父组件的属性数据类型 ,数据类型有: String, Number, Bookean, Object, Array, Function

                      ...
                      props: {
                        propA: Number,
                        PropB: [String, Number],
                        PropC: {
                          type: Boolean,
                          default: true
                        },
                        PropD: {
                          type: Number,
                          required: true
                        },
                        PorpE: {
                          type: Array,
                          default: function() {
                            return []
                          }
                        },
                        propF: {
                          validator: function(value) {
                            return value > 10
                          }
                        }
                      }
                      
                      1
                      2
                      3
                      4
                      5
                      6
                      7
                      8
                      9
                      10
                      11
                      12
                      13
                      14
                      15
                      16
                      17
                      18
                      19
                      20
                      21
                      22
                      23
                      24

                      # 子组件向父组件通信

                      核心思想就是,在子组件的方法中用 this.$emit('父组件监听事件名','数据'); 触发父组件的事件,然后父组件定义事件并接受数据。

                      // 子组件中(my-component):
                      <button @click="handleClick">+1</button>
                      export default {
                        ...
                        data() {
                          return {
                            conter: 0
                          }
                        },
                        methods: {
                          handleClick(){
                            this.counter++;
                            this.$emit('increase', this.counter);     // 触发父组件事件和传递数据
                          }
                        }
                      }
                      
                      // 父组件中
                      <my-component @increase="handleIncrease"></my-component>    // 监听事件,不需要参数列表
                      ...
                      new Vue({
                        ...
                        methods: {
                          handleIncrease(num) {     // 定义事件,此处接收参数
                            xxxx;
                          }
                        }
                      });
                      
                      1
                      2
                      3
                      4
                      5
                      6
                      7
                      8
                      9
                      10
                      11
                      12
                      13
                      14
                      15
                      16
                      17
                      18
                      19
                      20
                      21
                      22
                      23
                      24
                      25
                      26
                      27
                      28

                      如果来自子组件的数据是想更新父组件的数据,还有一种简便的方法。当在父组件上用 v-model 绑定数据时,在子组件中直接触发父组件的 input 事件即可,所有的数据更新流程已经在底层实现。

                      // 父组件中
                      <my-component v-model="total"></my-component>
                      new Vue({
                        data() {
                          return {
                            total: 0
                          }
                        }
                      });
                      
                      // 子组件中
                      <button @click="handleClick">+1</button>
                      export default{
                          data: function() {
                              counter: 0
                          }
                          methods: {
                            this.counter++;
                            this.$emit('input', this.counter);
                          }
                      };
                      
                      1
                      2
                      3
                      4
                      5
                      6
                      7
                      8
                      9
                      10
                      11
                      12
                      13
                      14
                      15
                      16
                      17
                      18
                      19
                      20
                      21

                      (不重要)如果上面的代码块难以理解, 可以通过下方的代码加深理解。

                      // 父组件
                      <my-component @input="handleInput"></my-component>
                      new Vue({
                        data() {
                          return {
                            total: 0
                          }
                        },
                        methods: {
                          handleInput(num) {
                            this.total = num;
                          }
                        }
                      });
                      
                      // 子组件中
                      <button @click="handleClick">+1</button>
                      export default {
                        methods: {
                          handleClick: function() {
                            this.$emit('input', 8)
                          }
                        }
                      }
                      
                      1
                      2
                      3
                      4
                      5
                      6
                      7
                      8
                      9
                      10
                      11
                      12
                      13
                      14
                      15
                      16
                      17
                      18
                      19
                      20
                      21
                      22
                      23
                      24

                      # 非父子组件通信

                      Case1: 可以通过新建一个 Vue 实例作为数据中继。具体实现如下: 先新建一个 Vue 实例 bus,在注册 app容器(父组件) 的时候注册监听 bus 的事件,然后在子组件中触发 bus 中的事件,来触发父组件中的监听事件。

                      // 父组件中
                      <div id="app">
                        {{ message }}
                        <my-component></my-component>
                      </div>
                      <script>
                          var bus = new Vue();
                          new Vue({
                              data: {
                                message: ''
                              },
                              mounted: function() {
                                var _this = this;
                                // 监听来自 bus 实例的事件
                                bus.$on('on-message', function(msg) {   //这里监听
                                    _this.message = msg;
                                });
                              }
                          });
                      
                      // 子组件中
                          <button @click="handleEvent">传递事件</button>
                          export default {
                            methods: {
                              handleEvent: function() {
                                bus.$emit('on-message', '来自 my-component 的数据');   //这里触发
                              }
                            }
                          }
                      </script>
                      
                      1
                      2
                      3
                      4
                      5
                      6
                      7
                      8
                      9
                      10
                      11
                      12
                      13
                      14
                      15
                      16
                      17
                      18
                      19
                      20
                      21
                      22
                      23
                      24
                      25
                      26
                      27
                      28
                      29
                      30

                      Case2: 父链:在子组件中使用 this.$parent 可以直接访问父组件。

                      // 父组件
                      {% raw %}{{ message }}{% endraw %}
                      <component-a></component-a>
                      new Vue({
                        data() {
                          return {
                            message: ''
                          }
                        }
                      });
                      
                      // 子组件
                      <button @click="handleEvent">修改父组件属性值</button>
                      export default{
                        methods: {
                          handleEvent: function() {
                            this.$parent.message = "来自自组件的数据"
                          }
                        }
                      }
                      
                      1
                      2
                      3
                      4
                      5
                      6
                      7
                      8
                      9
                      10
                      11
                      12
                      13
                      14
                      15
                      16
                      17
                      18
                      19
                      20

                      Case3: 子链【xxxxxx不看也罢】

                      # slot 插槽

                      可以简单理解成从父元素传递 DOM 元素给子元素的一种技术。

                      // 子组件: my-component
                      <div class="abc">
                        <slot name="xxx"> // 通过 name 标记插槽, 如果没有 name, 会自动标记为默认插槽。
                            Content...    // 默认内容,如果 父元素没有传递 DOM 来渲染这个
                        </slot>
                      </div>
                      // 父组件
                      <my-component>
                          <p slot="xxx">    // 与子元素的 name 属性相对应
                             ...
                          </p>
                      </my-component>
                      
                      1
                      2
                      3
                      4
                      5
                      6
                      7
                      8
                      9
                      10
                      11
                      12

                      作用域插槽: 父元素传递的 Dom 给子元素的数据 留有占位符。

                      // 子组件: my-component
                      <div>
                        <slot msg="来自子组件的数据"></slot>
                      </div>
                      // 父组件
                      <my-component>
                          <template slot-scope="props">
                              <p>父元素的内容</p>
                              <p>{%raw%}{{ props.msg }}{%endraw%}</p>
                          </template>
                      </my-component>
                      
                      1
                      2
                      3
                      4
                      5
                      6
                      7
                      8
                      9
                      10
                      11

                      下面这种用法,先通过属性 props 父组件给子组件传递了一个数组,然后子组件又将每一个数据返给父组件。父组件又用返回的数据去渲染每一个插槽......

                      <div>
                          <my-component :books="books">
                            <template slot="book" slot-scope="props">
                                <li> {%raw%}{{ props.bookName }}{%endraw%}</li>
                            </temlate>
                          </my-component>
                      </div>
                      <script>
                          Vue.component('my-component', {
                            props: {
                              books: [
                                type: Array,
                                default: function(){
                                  return [];
                                }
                              ]
                            },
                            template: '\
                            <ul>\
                            <slot name="book"\
                            v-for="book in books"\
                            :bookName="book.name">\
                            </slot>\
                            </ul>'
                          });
                      
                          var app = new Vue({
                            ...
                            data() {
                              return {
                                books: [
                                  { name: '<xxx>'},
                                  { name: '<sss>'}
                                ]
                              }
                            }
                          });
                      </script>
                      
                      1
                      2
                      3
                      4
                      5
                      6
                      7
                      8
                      9
                      10
                      11
                      12
                      13
                      14
                      15
                      16
                      17
                      18
                      19
                      20
                      21
                      22
                      23
                      24
                      25
                      26
                      27
                      28
                      29
                      30
                      31
                      32
                      33
                      34
                      35
                      36
                      37
                      38

                      # Vue-router

                      在前段实现 路由功能。可以按需加载~

                      1.安装和导入

                      // 安装
                      npm install --save vue-router
                      yarn add vue-router
                      // 引用
                      import Vue from 'vue'   // 定位
                      import VueRouter from 'vue-router'
                      import App from './App.vue'
                      
                      Vue.use(VueRouter);   // 在 new Vue之前
                      
                      1
                      2
                      3
                      4
                      5
                      6
                      7
                      8
                      9

                      2.基本使用

                      const Routers = [
                        {
                            path:   '/index',
                            meta: {
                              title: '首页'
                            },
                            component: (resolve) => require(['./component/index.vue'], resolve)     // 这种写法是按需加载路由:会将js 文件分成多个文件,配合每一个组件
                        },
                        {
                            path:   '/about',
                            meta: {
                              title: '关于'
                            },
                            component: require('./component/about.vue')       // 这种写法是一次性加载所有路由
                        }
                      ]
                      
                      // 一些路由配置
                      const RouterConfig = {
                        mode: 'history',
                        routes: Routers
                      }
                      
                      // 生成路由对象
                      const router = new VueRouter(RouterConfig);
                      // 一些钩子
                      router.beforeEach((to, from, next) => {
                          // to: 目标路由对象
                          // from: 当前路由对象
                          // next: 调用改方法后才会进入下一个钩子 ~ return
                          window.document.title = to.meta.title;
                          next();
                      });
                      
                      router.afterEach((to, from, next) => {
                        ...
                      });
                      // 实例化 Vue 时候加入 Router
                      new Vue({
                        el: '#app',
                        ...
                        router: router
                      });
                      
                      // 在模板中使用: 只能在 #app 容器中使用
                      <div id="app">
                          <router-view></router-view>
                          <router-link to="/index">首页</router-link>     // -> <a href="/index">首页</a>
                          <router-link to="/index" tag="li">首页</router-link> //
                          <router-link to="/index" replace>首页</router-link>   // 无痕模式,浏览器无法返回
                      </div>
                      
                      1
                      2
                      3
                      4
                      5
                      6
                      7
                      8
                      9
                      10
                      11
                      12
                      13
                      14
                      15
                      16
                      17
                      18
                      19
                      20
                      21
                      22
                      23
                      24
                      25
                      26
                      27
                      28
                      29
                      30
                      31
                      32
                      33
                      34
                      35
                      36
                      37
                      38
                      39
                      40
                      41
                      42
                      43
                      44
                      45
                      46
                      47
                      48
                      49
                      50
                      51

                      # Vuex

                      从组建中分离,几种管理易于共享的数据管理。

                      1.安装和引用

                      // 安装 yarn add vuex
                      // 引入
                      import Vue from 'vue'
                      import Vuex from 'vuex'
                      
                      Vue.use(Vuex)
                      ...
                      
                      const store = new Vuex.Store({
                        key: value
                      });
                      
                      new Vue({
                        el: '#app',
                        ...
                        store: store
                      });
                      
                      1
                      2
                      3
                      4
                      5
                      6
                      7
                      8
                      9
                      10
                      11
                      12
                      13
                      14
                      15
                      16
                      17

                      2.直接读数据

                      state 中的数据可以直接读取,但是不能直接修改!

                      const store = new Vuex.Store({
                        state: {
                          count01: 0,
                          count02: 3
                        }
                      });
                      // 组件中
                      <div>
                      {%raw%}
                        {{ this.$store.state.count01}}
                        {{ count02 }}
                      {%endraw%}
                      </div>
                      ...
                      export default {
                        computed: {
                          count02() {
                            return this.$store.state.count
                          }
                        }
                      }
                      
                      1
                      2
                      3
                      4
                      5
                      6
                      7
                      8
                      9
                      10
                      11
                      12
                      13
                      14
                      15
                      16
                      17
                      18
                      19
                      20
                      21
                      1. 通过 mutations 来修改数据

                      直接定义一些简单的数据操作逻辑,更复杂的数据操作逻辑用

                      const store = new Vuex.Store({
                          state: {
                              count: 0
                          },
                          mutataions: {
                              increment(state) {
                                  state.count++;
                              },
                              decrement(state, n=2) {
                                  state.count += n
                              }
                          }
                      });
                      
                      // 组件中
                      <button @handleIncrement>Add</button>
                      <button @handleDecrement>Dele</button>
                      ...
                      export default {
                         methods: {
                            increment() {
                                this.$store.commit('increment')
                            },
                            decrement() {
                              this.$store.commit('decrement', 5)
                            }
                         }
                      }
                      
                      1
                      2
                      3
                      4
                      5
                      6
                      7
                      8
                      9
                      10
                      11
                      12
                      13
                      14
                      15
                      16
                      17
                      18
                      19
                      20
                      21
                      22
                      23
                      24
                      25
                      26
                      27
                      28

                      mutations 中不要进行复杂的操作,比如异步等等。这些要在 action中进行。

                      4.用 getters 进行数据读前再操作(过滤、统计、排序)

                      如果说 state 是从组件的 data 模块分离出来,那么 getter 就是从 computed 中分离出来的~

                      const store = new Vuex.Store({
                          state: {
                              list: [1, 5, 9, 11]
                          },
                          getters: {
                              filteredList: (state) => {
                                  return state.list.filter((item) => item < 10));
                              },
                              listCount:  (state, getters) => {
                                  return getters.filteredList.length;
                              }
                          }
                      });
                      
                      // 组件中
                      <div>{%raw%}{{ list }}{%endraw%}</div>
                      ...
                      export default{
                          computed: {
                             list: function() {
                               return this.$store.getters.filteredList
                             },
                      
                             listCount: function() {
                               return this.$store.getters.listCount
                             }
                          }
                      }
                      
                      1
                      2
                      3
                      4
                      5
                      6
                      7
                      8
                      9
                      10
                      11
                      12
                      13
                      14
                      15
                      16
                      17
                      18
                      19
                      20
                      21
                      22
                      23
                      24
                      25
                      26
                      27
                      28

                      5.在 action 中完成复杂的数据操作

                      // main.js
                      const store = new Vuex.Store({
                          state: {
                            count: 0
                          },
                      
                          mutataions: {
                            increment(state, n=1) {
                               state.count += n;
                            }
                          },
                          actions: {
                            asyncIncrement (context) {
                              return new Promise( resolve => {
                                setTimeout(()=>{
                                  context.commit('increment');
                                  resolve();
                                },1000);
                              });
                            }
                          }
                      });
                      
                      // 组件中
                      <button @click="@handleAsyncIncrease">+1</button>
                      ...
                      export default{
                          ...
                          methods: {
                              handleAsyncIncrease() {
                                  this.$store.dispatch('asyncIncrement').then( ()=>{
                                      console.log(this.$store.state.count)
                                  });
                              }
                          }
                      }
                      
                      1
                      2
                      3
                      4
                      5
                      6
                      7
                      8
                      9
                      10
                      11
                      12
                      13
                      14
                      15
                      16
                      17
                      18
                      19
                      20
                      21
                      22
                      23
                      24
                      25
                      26
                      27
                      28
                      29
                      30
                      31
                      32
                      33
                      34
                      35
                      36

                      mutations 和 action看起来很相似,规定: 设计数据改变的,用mutations, 有业务逻辑的使用 actions.

                      6.利用 module 对数据再分组

                      当项目很大时,store 里面的state、getters、mutations 会非常多,都放在 main.js 中显得很不友好, 使用 modules 可以把他们写到不同的文件中。每个 module 都拥有自己的state、getters、mutations、actions.

                          const moduleA = {
                              state: {},
                              mutations: {},
                              actions: {},
                              getters: {}
                          }
                      
                          const moduleB = {
                              state: {}
                              ....
                          }
                      
                          ...
                      
                          const store = new Vuex.Store({
                              modules: {
                                  a: moduleA,
                                  b: mouduleB
                              }
                          });
                      
                          ...
                      
                          store.state.a     // moduleA 的状态
                          store.state.b     // moduleB 的状态
                      
                      1
                      2
                      3
                      4
                      5
                      6
                      7
                      8
                      9
                      10
                      11
                      12
                      13
                      14
                      15
                      16
                      17
                      18
                      19
                      20
                      21
                      22
                      23
                      24
                      25

                      # 最佳实践

                      上次更新: 2022/05/09, 21:21:45
                      最近更新
                      01
                      DefineSprintBootStarter
                      03-23
                      02
                      Spring MVC 启动流程分析
                      03-23
                      03
                      Redis
                      03-23
                      更多文章>
                      Theme by Vdoing | Copyright © 2019-2024 Human0722 | MIT License
                      • 跟随系统
                      • 浅色模式
                      • 深色模式
                      • 阅读模式