vue开发常见问题集锦（一）——vue获取参数，状态数据

vue获取参数

export const urlPar = function (name) {
  var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)", "i");
  var r = window.location.search.substr(1).match(reg);
  if (r != null) return unescape(r[2]); return null;
}

当vue的单页应用部署到服务器中的时候的标配链接案例

http://172.19.35.37:8081/zyglpt/front/index.html?user_id=9ffeb49b-1d50-4dcd-98e9-41702ae52057&greenhouse_id=0802&crop_id=029cd440-0ae9-4e89-8f9d-7421e0713947&aaa=11#/

当由其他页面跳转到vue的页面的时候，就可以在生命周期创建的时候获取参数。

import {mapState,mapMutations} from 'vuex';
export default {
    name: "home",
    computed:mapState({
      userInfo:state=>state.userInfo
    }),
    methods: {
      ...mapMutations([
        'changeId','changeGreenhouseId','changeCropId'
      ]),
      /*获取数据*/
      init() {
        this.changeId(urlPar('user_id'));
        this.changeGreenhouseId(urlPar('greenhouse_id'));
        this.changeCropId(urlPar('crop_id'));
      }
    },
    created: function () {
      this.init()

    }
  }