vue 知识点

 

vue请求方式之一

<!-- 直接引入使用 -->
<script src="https://cdn.staticfile.org/vue-resource/1.5.1/vue-resource.min.js"></script>
<!-- npm安装 -->
npm install vue-resource

// 使用方法
init() {
  // 从服务器请求JSON格式的文本数据
  let url = '请求地址'
  this.$http.get(url).then(function(response){
    if(response.status === 200){
      console.log(response.data)
    }
  },function(){
    this.$Message.error('数据获取失败,请检查接口是否正常!');
  })
}

本地存储

括号值存到关键中

sessionStorage.setItem('uname', req.content.userName)

VUE页面加载时取值

created () {
    this.username = sessionStorage.getItem('uname')
  }

移除本地缓存

sessionStorage.removeItem('uname')

输入取值

<!-- html -->
<input type="text" ref="sum" placeholder="请输入">

// js
var orderAmount = that.$refs.sum.value
console.log(orderAmount)

多个拼到一起

<!-- html -->
<input type="text" ref="keyWord1" class="keyinput">
<input type="text" ref="keyWord2" class="keyinput">
<input type="text" ref="keyWord3" class="keyinput">

 

// js
export default {
  data () {
    return { 
      keywords: []
 } }}
that.keywords.push(that.$refs.keyWord1.value)
that.keywords.push(that.$refs.keyWord2.value)
that.keywords.push(that.$refs.keyWord3.value)var keyword = that.keywords + ','

复选框取值

<!-- html -->
<input type="checkbox" v-model="statistics" value='请输入'>
// js
export default {
  data () {
    return {
      statistics: []
    }
  }
}
var statistics = that.statistics + ','

跳转页面（前提写好路由路径）

this.$router.push('/login')
// 刷新页面
window.location.reload()

跳转页面时传值

// 传值（path是跳转路径，orderId是随便取的名，e是所传的值）
this.$router.push({path: 'orderinfo', query: { orderId: e }})
// 取值
var orderId = {orderId: this.$route.query.orderId}