Vue基础
关注
分享
扫一扫
Vue基础
Aran_
风筝有风，海豚有海
展开
专栏收录文章
- 默认排序
- 最新发布
- 最早发布
- 最多阅读
- 最少阅读
-
[实战] springBoot + Vue 如何实现前后端分离跨域请求？
Vue中， 我使用了被大家用烂了的 axios，为了实现跨域请求，需要如下配置： 关于 withCredentials 的含义： 一下摘自 mozilla开发者中心 XMLHttpRequest.withCredentials 属性是一个Boolean类型，它指示了是否该使用类似cookies,authorization headers(头部授权)或者TLS客户端证书这一类资格证书来创建一个跨站点访问控制（cross-site Access-Control）请求。在同一个站点下使用withCrede.原创 2020-06-15 20:26:52 · 399 阅读 · 0 评论 -
[Vue基础] vue-cli搭建出的项目基本结构
├── build/ # webpack 编译任务配置文件: 开发环境与生产环境 │ └── ... ├── config/ │ ├── index.js # 项目核心配置 │ └── ... ├ ── node_module/ #项目中安装的依赖模块 ── src/ │ ├── main.js # 程序入口文件原创 2020-05-31 18:44:41 · 185 阅读 · 0 评论 -
[Vue基础] Vue中的X-Template
参考书籍：《Vue.js实战》 梁灏 如果你没有使用webpack、gulp等工具，试想一下你的组件template的内容很冗长、复杂、如果都在JavaScript里拼接字符串，效率是很低的，因为不能像写HTML那样舒服，Vue提供了一种定义模板的方式，在<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content=原创 2020-05-28 20:38:23 · 468 阅读 · 0 评论 -
[Vue基础] Vue中的$nextTick
参考书籍：《Vue.js实战》 场景： 有一个div，默认用v-if将它隐藏，点击一个按钮后，改变v-if的值，让它显示出来，同时拿到这个div的文本内容。如果v-if的值是false, 直接去获取div的内容是获取不到的，因为此时，div还没有被创建出来，那么应该在点击按钮后，改变v-if的值为true，div才会被创建，此时再去获取。 一、常规做法： ...原创 2020-05-28 20:11:16 · 386 阅读 · 0 评论 -
Vue.js实战——表单与v-model
参考《Vue.js实战》 梁灏 1. 基本用法 话不多说，来个入门： <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>表单入门</title> <script src="js/vue.min.js" type="text/javas...原创 2020-03-11 15:01:21 · 251 阅读 · 0 评论 -
Vue.js实战——内置指令（三）实例：简易购物车实现
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>简易购物车实现</title> <link rel="stylesheet" href="css/style.css"> </head> <body>...原创 2020-03-10 18:20:46 · 339 阅读 · 0 评论 -
Vue.js实战——内置指令（二）
参考《Vue.js实战》梁灏 1 方法与事件 1.1 基本用法 直接上代码，这样最实在： <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>方法与事件的基本用法</title> <script src="js/vue.min.js" ...原创 2020-03-10 16:33:54 · 231 阅读 · 0 评论 -
Vue.js实战——内置指令（一）
参考：《Vue.js实战》梁灏 1. 基本指令 1.1 v-cloak <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>v-cloak</title> <script src="js/vue.min.js" type="text/j...原创 2020-03-09 17:12:52 · 398 阅读 · 0 评论 -
Vue.js实战——v-bind及class与style绑定
参考：《Vue.js实战》梁灏 1. 绑定class的几种方式 1.1 对象语法 <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>v-bind绑定Class之对象语法</title> <script src="js/vue.min....原创 2020-03-06 11:35:29 · 366 阅读 · 0 评论 -
Vue.js实战——计算属性
参考：《Vue.js实战》梁灏 1 什么是计算属性 在模板中，如果表达式过长，或逻辑更为复杂时，就会变得臃肿甚至难以阅读和维护： <div> {{ text.split(",").reverse().join(",") }} </div> 可以改用如下的计算属性进行改写： <!DOCTYPE html> <html> <head>...原创 2020-03-05 16:11:16 · 316 阅读 · 0 评论 -
Vue.js实战——数据绑定和第一个Vue应用（二）
2.指令与事件 2.1 v-bind与v-on 指令（Dicrectives）是Vue.js模板中最常用的一项功能 数据驱动DOM是Vue.js的核心概念，所以不可轻易主动操作DOM v-bind:动态更新HTML元素上的属性，比如id，class等，语法糖：: v-on:绑定事件监听器，语法糖：@ <!DOCTYPE html> <html> <head&...原创 2020-03-05 14:05:32 · 245 阅读 · 0 评论 -
Vue.js实战——数据绑定和第一个Vue应用（一）
参考：《Vue.js实战》梁灏 1.1 Vue实例与数据绑定 <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> <script src="js/vue.min.js" type="text/javascript" ch...原创 2020-03-05 10:56:26 · 379 阅读 · 0 评论