Processing math: 100%

随笔分类 -  Vue

摘要:前言 这是前后端分离项目的第四篇文章。 1. Spring Boot + Vue 前后端分离项目 -- 登录页制作 2. Spring Boot + Vue 前后端分离项目 -- 后端登录接口实现 3. Spring Boot + Vue 前后端分离项目 -- 前后端登录接口对接 这篇文章主要实现的 阅读全文
posted @ 2021-05-09 10:18 爱吃西瓜的番茄酱 阅读(2568) 评论(1) 推荐(0) 编辑
摘要:前言 我们先进行了登录页面的绘制:在 Vue 中使用 Element UI 然后再实现了后端登录接口:Spring Boot + Vue 前后端分离项目 -- 后端登录接口实现 现在可以进行前后端登录接口对接了。 准备工作 1、安装 axios 在 vue 项目中,需要使用 axios 发送网络请求 阅读全文
posted @ 2021-05-06 22:57 爱吃西瓜的番茄酱 阅读(4356) 评论(0) 推荐(0) 编辑
摘要:新建一个 vue 项目 参考文章:使用命令行创建 Vue 项目 整合 Element UI 安装 Element UI npm i element-ui -S 安装完毕之后,package.json 文件中会有 Element UI 及其版本号,如下所示: 引入 Element 在 main.js 阅读全文
posted @ 2021-05-03 15:35 爱吃西瓜的番茄酱 阅读(800) 评论(0) 推荐(1) 编辑
摘要:前言 对于 SpringBoot + Vue 前后端分离项目,一般是先启动后端,再启动前端,通过访问前端地址进行预览。 比如,后端的端口号是 8081,前端的端口号是 8080。既然前后端是不同的端口号,怎么通过访问前端进而与后端通信呢? 这里就涉及到 Vue 配置请求转发,具体可以参考文章:Vue 阅读全文
posted @ 2021-04-25 09:17 爱吃西瓜的番茄酱 阅读(5128) 评论(0) 推荐(2) 编辑
摘要:前言 在表单校验中,常常会对身份证号码进行校验,关于表单校验,参考 ElementUI 表单校验的方法 身份证号码的正则表达式 /^[1-9]\d{5}(18|19|20|(3\d))\d{2}((0[1-9])|(1[0-2]))(([0-2][1-9])|10|20|30|31)\d{3}[0- 阅读全文
posted @ 2021-04-13 10:02 爱吃西瓜的番茄酱 阅读(2599) 评论(0) 推荐(1) 编辑
摘要:添加属性 在<el-form>标签下,增加三个属性: ref="loginForm" :rules="rules" :model="formData" 其中,ref="loginForm"表示为表单起个别名,叫做loginForm :rules="rules",表示定义一套校验规则,名字叫做rule 阅读全文
posted @ 2021-04-13 09:55 爱吃西瓜的番茄酱 阅读(817) 评论(0) 推荐(0) 编辑
摘要:为什么要学习 Vue? 不懂前端的后端工程师,不是好厨师。前端三大框架:Vue、Angular、React,其中 Vue 最为简单,容易上手。 学习 Vue 的准备 学习前端框架,离不开 JS,所以,JS 是学习 Vue 的前提。 关于 JS 的学习资源,参考:廖雪峰老师的 JavaScript 教 阅读全文
posted @ 2021-03-30 21:28 爱吃西瓜的番茄酱 阅读(120) 评论(0) 推荐(0) 编辑
摘要:1、使用import导入组件,可以获取到组件 var name = 'system'; var myComponent =() => import('../components/' + name + '.vue'); var route={ name:name, component:myCompon 阅读全文
posted @ 2021-03-26 09:49 爱吃西瓜的番茄酱 阅读(3018) 评论(0) 推荐(0) 编辑
摘要:前言 Vuex 是一个专为 Vue.js 应用程序开发的状态管理模式。它采用集中式存储管理应用的所有组件的状态,并以相应的规则保证状态以一种可预测的方式发生变化。 每一个 Vuex 应用的核心就是 store(仓库)。“store”基本上就是一个容器,它包含着你的应用中大部分的状态 (state)。 阅读全文
posted @ 2021-03-23 21:19 爱吃西瓜的番茄酱 阅读(2370) 评论(0) 推荐(0) 编辑
摘要:含义 不要重复导航到当前位置。 解决办法 在 router.js 或者 /router/index.js 路由文件中,添加如下代码: const originalPush = VueRouter.prototype.push VueRouter.prototype.push = function p 阅读全文
posted @ 2021-03-22 16:41 爱吃西瓜的番茄酱 阅读(586) 评论(0) 推荐(0) 编辑
摘要:Vue 页面跳转的 5 种方式 this.router.pushthis.router.replace this.router.gothis.router.back this.router.forwardthis.router.push 想要导航到不同的 URL,则使用 route 阅读全文
posted @ 2021-03-21 19:14 爱吃西瓜的番茄酱 阅读(273) 评论(0) 推荐(0) 编辑
摘要:写在前面 既然是浅谈,就不会详细从底层原理解释这几个的区别,就简单地聊一下,这几个的区别,优缺点,应用场景 cookie 和 session 的作用 浏览器的缓存机制提供了可以将用户数据存储在客户端上的方式,可以利用 cookie 和 session 跟服务端进行数据交互。cookie 和 sess 阅读全文
posted @ 2021-03-21 18:49 爱吃西瓜的番茄酱 阅读(66) 评论(0) 推荐(0) 编辑
摘要:前言 使用 Vue 和 Spring Boot 开发前后端分离项目时,配置前端项目和后端项目在不同的端口下启动。 步骤 vue3 在使用 vue-cli3 创建项目后,在项目的根目录下,新建 vue.config.js 文件,来配置关于请求转发: let proxyObj = {}; proxyOb 阅读全文
posted @ 2021-03-21 18:12 爱吃西瓜的番茄酱 阅读(3084) 评论(0) 推荐(0) 编辑
摘要:什么是 axios? Axios 是一个基于 promise 的 HTTP 库,可以用在浏览器和 node.js 中。 安装 npm i axios --S 引入 在 js 文件开头,使用如下命令引入: import axios from "axios"; Get 方法 new Vue({ el: 阅读全文
posted @ 2021-03-21 13:57 爱吃西瓜的番茄酱 阅读(98) 评论(0) 推荐(0) 编辑
摘要:Vue 提供了一个官方的 CLI,为单页面应用 (SPA) 快速搭建繁杂的脚手架。它为现代前端工作流提供了 batteries-included 的构建设置。只需要几分钟的时间就可以运行起来并带有热重载、保存时 lint 校验,以及生产环境可用的构建版本。 1、首先安装 Vue CLi 参考文档:h 阅读全文
posted @ 2020-06-10 20:52 爱吃西瓜的番茄酱 阅读(151) 评论(0) 推荐(0) 编辑
摘要:Vue 项目创建完成后,使用 Web Storm 打开项目。 如何创建 Vue 项目参考链接:https://www.cnblogs.com/youcoding/p/13085949.html 项目目录如下: build 文件夹,用来存放项目构建脚本 config 中存放项目的一些基本配置信息,最常 阅读全文
posted @ 2020-06-10 16:27 爱吃西瓜的番茄酱 阅读(210) 评论(0) 推荐(0) 编辑
摘要:1、首先需要安装好 Node.js 下载地址:https://nodejs.org/zh-cn/ 安装好之后,打开 cmd 试一下: 2、修改 npm install 镜像源 npm config set registry https://registry.npm.taobao.org 3、安装 V 阅读全文
posted @ 2020-06-10 16:12 爱吃西瓜的番茄酱 阅读(564) 评论(0) 推荐(0) 编辑
摘要:注:IDEA 和 WebStorm 的快捷键是通用的 IntelliJ IDEA 常用快捷键总结 1、在已有的 HTML 文件内容上新建 HTML 文件: 先按Ctrl+c, 再Ctrl+v,输入新HTML文件名回车 2、向上插入空行:ctrl+alt+enter 3、向下插入空行:shift+en 阅读全文
posted @ 2020-06-08 21:06 爱吃西瓜的番茄酱 阅读(328) 评论(0) 推荐(0) 编辑
摘要:首先 使用 WebStorm 新建一个空项目,再新建一个 HTML 文件 在 HTML 文件中写入如下代码: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <script src 阅读全文
posted @ 2020-06-08 15:39 爱吃西瓜的番茄酱 阅读(564) 评论(0) 推荐(0) 编辑
摘要:1、新建一个空项目 2、在项目下新建一个 HTML 文件 3、在 HTML 文件中写入: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <script src="https:// 阅读全文
posted @ 2020-06-08 14:40 爱吃西瓜的番茄酱 阅读(417) 评论(0) 推荐(0) 编辑

点击右上角即可分享
微信分享提示