goMars的学习随记

配置FastJSON导入依赖12345<dependency> <groupId>com.alibaba</groupId> <artifactId>fastjson</artifactId> <version>1.2.33</version></dependency> 将fastJson转换器注入容器1234567891011121314151617181920212223242526272829303132@Configurationpublic class IntercaptorConfig implements WebMvcConfigurer { /** * 使用@Bean注入fastJsonHttpMessageConvert * @return */ @Bean public HttpMessageConverter fastJsonHttpMessageConverters() { ...

SpringBoot简介​ SpringBoot本质就是一个javaweb的开发框架，和SpringMVC类似，对比其他javaweb框架的好处，官方说是简化开发，约定大于配置，能迅速的开发web应用。不仅继承了Spring框架原有的优秀特性，而且还通过简化配置来进一步简化了Spring应用的整个搭建和开发过程。另外SpringBoot通过集成大量的框架使得依赖包的版本冲突，以及引用的不稳定性等问题得到了很好的解决。 特点： （1）可以创建独立的Spring应用程序，并且基于其Maven或Gradle插件，可以创建可执行的JARs和WARs； （2）内嵌Tomcat或Jetty等Servlet容器； （3）提供自动配置的“starter”项目对象模型（POMS）以简化Maven配置； （4）自动配置Spring以及第三方功能； （5）提供生产级别的监控、健康检查及外部化配置； （6）无代码生成、无需编写XML； SpringBoot的使用SpringBoot的入门使用一、Maven方式创建 创建一个maven工程 导入maven依赖 1234567891011121 ...

Vuex 概念： 专门在Vue中实现集中式状态（数据）管理的一个Vue插件，对vue应用中多个组件的共享状态进行集中式的管理（读/写），也是一种组件间通信的方式，且适用于任意组件间通信。 使用场景：共享数据 多个组件依赖同一状态 来自不同组件的行为需要变更同一状态 原理图： vuex由三个部分组成：Actions、Mutations、State，并统一由store来管理 Actions：接收Vue Components 对共享数据的操作并commit给Mutations（还有一个很重要的作用是可以只接收操作，但是数据可以在Actions中向后端请求或者有一定的业务逻辑） Mutations：按照Actions提交的操作对共享数据进行相应具体的操作（同样允许Vue Components直接调用commit越过Mutations） State：存储共享数据 基本使用 安装vuex：npm i vuex (如果是vue2 只能安装npm i vuex@3) 创建store来管理vuex的三个主要对象： 123456789101112//在main.js中引入store 因为j ...

vue-routervue-router是Vue.js官方的路由插件,它和vue.js是深度集成的,适合用于构建单页面应用。专门用于单页面Web应用实现局部页面更新的插件库。 主要功能： 嵌套路由映射 动态路由选择 模块化、基于组件的路由配置 路由参数、查询、通配符 展示由 Vue.js 的过渡系统提供的过渡效果 细致的导航控制 自动激活 CSS 类的链接 HTML5 history 模式或 hash 模式 可定制的滚动行为 URL 的正确编码 安装和使用vue-router步骤一：安装vue-router npm install vue-router –save 步骤二：在模块化项目中使用它 导入路由对象，并调用Vue.use(VueRouter) 创建路由实例，并传入路由映射配置 在Vue实例中挂载创建的路由实例 具体使用 在src目录下创建router文件夹以及index.js（用于配置路由的相关信息） index.js： 1234567891011121314151617181920212223242526// 该文件专门用于创建整个应用的路由器import Vue ...

Vue发送异步请求 使用axios发送（常用） 安装axios：npm i axios 引入axios：import axios from ‘axios’ 发送请求： 12345678axios.get('http://localhost:5000/students').then( response => { console.log('请求成功了',response.data) }, error => { console.log('请求失败了',error.message) } ) 使用vue-resource发送 安装vue-resource：npm i vue-resource 使用该插件： 1234//引入插件import vueResource from 'vue-resource'//使用插件Vue.us ...

Vue响应式概念：响应式的效果就是，数据驱动视图。只用按照普通的语法，改变一个数据，相应的视图就自动更新。保证试图中的数据与组件中的数据同步。 原理： 通过Object.defineProperty来实现监听数据的改变和读取（属性中的getter和setter⽅法） 实现数据劫持 观察者模式（发布者-订阅者） 观察者(订阅者) – Watcher：update()：当事件发⽣时，具体要做的事情 目标(发布者) – Dep:①subs 数组：存储所有的观察者②addSub()：添加观察者③notify()：当事件发⽣，调⽤所有观察者的 update() 方法 当数据发⽣改变通过发布者订阅者模式来进行通知进行界面刷新 具体响应式方法数组方法 push()：该方法是在数组最后添加数据，并返回数组长度 pop()：删除最后一个元素，并返回删除的元素值 shift()：删除数组的第一个元素，返回第一个删除的值 unshift()：向数组开头添加元素，返回数组长度 reverse()：翻转数组 sort(function(a,b){return a-b})：数组排序升序/b-a降序 ...

动画效果基本使用方式1：12345678910111213141516171819202122232425262728293031323334353637383940414243<template> <div> <button @click="isShow = !isShow">显示/隐藏</button> <!-- apper默认开始就显示动画 --> <transition name="hello" appear> <h1 v-show="isShow">你好呀！</h1> </transition> </div></template><script>export default { name:'T ...

VueCLI介绍CLI是Command-Line Interface，翻译为命令行界面，但是俗称脚手架。Vue CLI是一个官方发布vue.js项目脚手架，使用vue-cli可以快速搭建Vue开发环境以及对应的webpacki配置， 安装 全局安装@vue/cli：npm install -g @vue/cli 切换到要创建项目的目录进行创建：vue create XXXX (vue cli3)/ vue init webpack 项目名称（vue cli2） 启动项目：npm run serve 相关配置方式一：通过vue ui修改 进入vue ui后导入项目 可以管理相应的依赖和插件 在配置项，配置相关配置 方式二：直接创建配置文件配置 创建vue.config.js文件（名称必须固定） 直接在文件中修改配置文件 1234567891011121314// vue.config.jsconst { defineConfig } = require('@vue/cli-service')module.exports = defi ...

Vue组件化组件化的诞生由于之前的传统页面编写方式存在的问题： 依赖关系混乱不好维护 代码复用性低 所以Vue提供了组件化的方式: 每个组件有自己相应的css、html、js等代码,体现了组件的封装，解决了传统方式存在的问题 组件化的基本使用具体步骤： 使用组件构造器创建组件 注册组件 使用组件 12345678910111213141516171819202122232425262728293031323334353637383940<div id="app"> <!-- 使用组件 --> <mycpn></mycpn></div><div id="app2"> <!-- 使用组件 --> <cpn></cpn></div><script src="../js/vue.js"></script><script> //1.使用组件构造器 ...

Vuejs基础Vue (是一套用于构建用户界面的浙进式框架。与其它大型框架不同的是，Vue被设计为可以白底向上逐层应用。Vue的核心库只关注视图层，不仅易于上手，还便于与第三方库或既有项目整合。另一方面，当与现代化的工贝链以及各种支持类库结合使用时，Vue也完全能够为复杂的单页应用提供驱动。 Vue初体验123456789101112131415161718192021222324252627<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>初体验</title></head><body> <div id="app"> {{message}} <ul> <li v-for="item in movies ...