vue 什么是渐进式 响应式 意思。Vue常用的指令。VUE:跨域设置。vue router 新窗口。$router.push。

Vue  是 轻量的 模型视图视图模型 框架。就是数据的双向开发。

数据驱动+组件化开发。

渐进式框架。

官网:cn.vuejs.org

 

在读 Vue2.0 文档的时候,介绍“Vue.js(读音 /vjuː/,类似于 view)是一套构建用户界面的渐进式框架。与其他重量级不同的是,Vue 采用自底向上增量开发的设计。”
那么问题来了,什么是“渐进式框架”?什么是“自底向上增量开发”?

 

渐进式:可以一步一步使用,可以选择性的精简使用。

暂且这么理解。  可以先跳过,不求甚解。之后用过vue开发之后自然可以体会出它的特点。

 

响应式:就是可以自适应调整布局,适应多种分辨率。

==

Vue 指令 都是 v-开头。

Angular 是以ng- 开头。所有的属性和方法都存储在作用域中。$scope。

 

这些框架包括react都不兼容低版本的因特尔浏览器,8以下的。

可以使用 bower info vue 来查看它的版本信息。所有版本。

 

浏览器控制台会提示下载vue的开发工具。

 

生产环境不要提示。

Vue.config.devtools=false;//取消调试。

Vue.config.productionTip= false;//取消提示。

 

Vue常用的指令

v-model  双向数据绑定。 一般用于表单元素。

v-for

v-on   绑定事件。用法: v-on:事件名=”函数”

鼠标经过 事件 mouseover

Arr.push(666)  向arr这个数组里面添加元素666.

判断两个对象相等  === 三个等号。


v-show/v-if 用来显示隐藏元素。 V-show是真正的隐藏,通过display实现。

v-if是每次删除后重新创建。

 

通过v-show和v-on:click来切换显示隐藏div

vue 什么是渐进式 响应式 意思。Vue常用的指令。VUE:跨域设置。vue router 新窗口。$router.push。_第1张图片

v-show 是给这个div添加display属性。V-if这个div就会消失或创建。


v-model

vue 什么是渐进式 响应式 意思。Vue常用的指令。VUE:跨域设置。vue router 新窗口。$router.push。_第2张图片


v-for

vue 什么是渐进式 响应式 意思。Vue常用的指令。VUE:跨域设置。vue router 新窗口。$router.push。_第3张图片

==

this.user.splice(this.nowIndex,1);//从指定索引位置开始删除,删除一个。

 

vue 中this.nowIndex === -1  三个等于来判断。



v-bind 属性的绑定。

 

v-bind:src=”url”

vue 什么是渐进式 响应式 意思。Vue常用的指令。VUE:跨域设置。vue router 新窗口。$router.push。_第4张图片

v-bind:src 简写为 :src

事件的简写 v-on:click简写@click

 

class 和style   一个 类一个样式。

动态的修改样式。动态的修改属性。

 

通过数组 来指定多个样式。

vue 什么是渐进式 响应式 意思。Vue常用的指令。VUE:跨域设置。vue router 新窗口。$router.push。_第5张图片




==

网站风暴 这个软件 可以直接拖拽vue.js这类文件,直接到html文件中,会直接生成

这条语句。

==

VUE:跨域设置

本地与非本地环境中的接口进行联调,会出现跨域问题。

在config文件夹下的index.js中。通过在该JS文件中的dev对象里配置proxyTable来实现跨域访问设置。

vue 什么是渐进式 响应式 意思。Vue常用的指令。VUE:跨域设置。vue router 新窗口。$router.push。_第6张图片

在该项配置中,target设置的是需要访问的API的域名,配置结束后,如果需要访问https://xxxxx/api/xxxx/xxx,只需要将访问的链接地址设置为/api/xxxx/xxx即可,webpack会进行转发。

S:如果在项目路径中没有找到config文件夹的童鞋,你可能需要更新下vue-cli了,老版本的vue-cli没有config以及build文件夹。

 

这种办法只能解决一部分此类问题。举个栗子,有时候开发会遇到调用接口需要依赖cookie的情况,但是不同域名下的cookie无法共享,这就导致在本地开发的过程中,虽然在vue-cli的config下做了跨域设置,能够调用到接口,但是却无法请求到数据的问题,这着实让人头疼不已。

==

404 跨域 80端口,允许3000端口。

koa跨域访问。默认是拦截的。

==

vue router 新窗口

$router.push 新窗口

 

//this.$router.push({ path: `/ip-list/${selectedIP}` })

letrouteData = this.$router.resolve({ path:'/ip-list', query: { selectedIP:selectedIP } });

//这种写法不行,参数传不过去。

//letrouteData = this.$router.resolve({ path: `/ip-list/${selectedIP}` });

window.open(routeData.href, '_blank');

 

 

//this.filters.name = this.$route.params.selectedIP

this.filters.name = this.$route.query.selectedIP,

==



你可能感兴趣的:(vue 什么是渐进式 响应式 意思。Vue常用的指令。VUE:跨域设置。vue router 新窗口。$router.push。)