vue2学习笔记一、根据环境改变常量、vuex中mapGetters只能在组件created之后使用

1、根据改变常量

我们在开发和生产环境下，ajax请求的地址是不一样的。在打包的时候，要把开发的ajax地址替换为生产的ajax地址。

可以去改变config/dev.env.js ， config/prod.env.js 这两个文件，分别在这两个文件里加上ajax地址。这两个js文件里的值，实际上是设置了process.env的值。

例如：dev.env.js

 

'use strict'
const merge = require('webpack-merge')
const prodEnv = require('./prod.env')

module.exports = merge(prodEnv, {
  NODE_ENV: '"development"',
  API_URL:'"http://localhost:8080/services/"'
})

在这个文件里，我增加了 API_URL这个参数。
在这里，尤其要注意的是，API_URL这个参数的值是单引号包着双引号。这样是确保从process.env里取值取出来的是是字符串。如果不这样做，取出来的值就不会是字符串，会报错。

 

2、vuex中mapGetters

在组件中设置了mapGetters,在组件的beforeCreated事件中，是取不到相应的值的，在created之后，才能取到。

例如：

 

 export default {
    name: 'First',
    data () {
      return {
        name: 'First Name'
      }
    },
    computed: {
      ...mapGetters(['getAjaxPath'])
    },
    beforeCreate () {},
    created () {
      let ajaxPath = this.getAjaxPath
      console.log(ajaxPath)
    }
  }