vue2.0 带参数 请求服务器数据 api：sellerid=123456

https://segmentfault.com/a/1190000010124638 全面分析vue2.0饿了么，值得一看

能够获取url地址中 ? 后面的数据并且还带上问号

  window.location.search;

如：http://192.168.43.124:8080/api/seller?id=123456中?

 window.location.search

返回结果：

?id=123456

   data () {
        return {
          seller: {// 展示部分
            id:(()=>{    
              let queryParam =urlParse();
              // console.log(queryParam)
              return queryParam.id;
            })()
           }         
        }       
      },        

url请求地址为 /api/seller?id=123456

带上参数id，此id就是 展示部分的id，

elink方法 ( () =>{} )() 返回id的 默认值

queryParam 是 js封装方法 ，import导入: import {urlParse} from “@/common/js/util”;

queryParam方法作用是：通过正则表达式匹配url地址中带的参数，并处理返回json格式数据

util.js文件中

/*
*   解析url参数
*   @example  ?id=12345&a=b
*   @return Object {id:123456,a:b}
*/ 

export function urlParse(){
    let url = window.location.search;
    let obj={};//返回一个json对象，初始化
    let reg=/[?&][^?&]+=[^?&]+/g;  //正则表达式  [?&]：匹配以?或&开头的  [^?&]+  匹配 非? 或 非& 开头的 +代表一个或多个字符 =：就是=等号字符，没有特殊意义 
    let arr =url.match(reg) //match() 正则表达式里面的方法  查询匹配项返回一个数组
    //arr=['?id=123456','&a=b']
    if (arr) {
        arr.forEach(item => {//item.substring(1)把arr=['?id=123456','&a=b']中的 ? 去掉
          let tempArr=item.substring(1).split('=');//.split('=')  把arr中等于号=做分割成数组
          let key=decodeURIComponent(tempArr[0]);
          let val=decodeURIComponent(tempArr[1]);  
          obj[key] = val;
        });
    }
    return obj;
}

重点在这里，向服务器端带参数请求数据

/api/seller?id='+this.seller.id

思路 点击商品列表,含有商品id,请求到详情页，在详情页中向服务器请求带参数id的数据

注意还要导入import axios from ‘axios’

 created () {
        this.getGoods() // 本地JSON
      },
      methods: {
        // 本地json获取商品数据
        getGoods () {
          axios.get('/api/seller?id='+this.seller.id).then((res) => {
            this.seller = res.data.data;
            // console.log(this.seller);
          })
        }
      },

Object.assign(target, source1, source2);

这是es6的语法，用于对象合并，将源对象（source）的所有可枚举属性，复制到目标对象（target）。

Object.assign方法的第一个参数是目标对象，后面的参数都是源对象。
注意，如果目标对象与源对象有同名属性，或多个源对象有同名属性，则后面的属性会覆盖前面的属性。

var target = { a: 1, b: 1 };

var source1 = { b: 2, c: 2 };
var source2 = { c: 3 };

Object.assign(target, source1, source2);
target // {a:1, b:2, c:3}

另外需要注意的是Object.assign()方法 只会拷贝 源对象自身的并且可枚举的属性 到目标身上。

也就意味着继承属性和不可枚举属性是不能拷贝的，

而且拷贝 是对象的属性的引用 而不是对象本身。

重点这是json对象

let idObj={"id":this.seller.id}

 // 本地json获取商品数据
        getGoods () {
          axios.get('/api/seller?id='+this.seller.id).then((res) => {
            // this.seller = res.data.data;
            let idObj={"id":this.seller.id}
            this.seller=Object.assign({},idObj,res.data.data);//assign()es6语法，用于对象的合并
            // console.log(this.seller.id);
         })
        }