插件使用

马兆亮 于 2018年8月20日17:00 编辑

数据请求

CAF框架数据请求使用了第三方库axios ， 它是Vue推荐的方案，功能强大，使用简便。
框架做了统一的请求和响应拦截，请求拦截实现了数据格式的转换，响应拦截处理了接口请求的各种错误。 可在 src/common/plugins/axios.js 中参考详细代码。

  Vue.prototype.$http = Axios

通过把Axios对象添加到Vue原型链，实现业务开发时调用数据请求工具的便捷性，举例说明：

  export default {
    methods: {
      userList () {
        this.$http.post(uri, {
          id: 13
        })
        .then(({data}) => { // ({data}) 使用了ES6的对象解构，从返回值对象中取出data域
          console.log(data)
        })
      }
    }
  }

状态共享

在大规模使用组件开发应用，尤其是存在组件深层次依赖时，组件间的数据交换困难重重，vuex是Vue生态圈为解决此类问题的优先方案，CAF也有vuex的使用，具体实现请参考 src/common/vuex下的代码

国际化

国际化采用Vue-i18n插件实现，资源组织规则如下：
在项目模块目录的locales目录下对应语言的资源文件（zh-CN.js、en-US.js）中增加资源配置：

  export default {
    module1: {
      page1: {
        key: value
      },
      page2: {
        key: value
      }
    }
  }

注意

请务必保持模块、页面、主键的三层结构，确保key不会重复

使用方法：

  this.$t(module1.page1.key) // 将i18n key翻译成当前语言所对应的文字