nuxt笔记

配置代理

yarn add @nuxtjs/axios 或者 npm install @nuxtjs/axios

 axios: {
    proxy: true
  },
  proxy: {
    '/api': 'http://api.example.com'
  },
 modules: ['@nuxtjs/axios']

组件中使用：http://api.example.com/test
```js
this.$axios.$get('/api/test').then(data => {
// todo
})
文档

添加百度统计

在plugins目录下创建tongji.js，内容如下：

if (process.BROWSER_BUILD && process.env.NODE_ENV === 'production') {
  var _hmt = _hmt || [];
  (function() {
    var hm = document.createElement("script");
    hm.src = "https://hm.baidu.com/hm.js?xxxx";
    hm.id = "baidu_tj";
    var s = document.getElementsByTagName("script")[0];
    s.parentNode.insertBefore(hm, s);
  })();
}

export default ({ app: { router }, store }) => {
  router.afterEach((to, from) => {
    var _hmt = _hmt || [];
    (function() {
      document.getElementById('baidu_tj') && document.getElementById('baidu_tj').remove();
      var hm = document.createElement("script");
      hm.src = "https://hm.baidu.com/hm.js?xxxx";
      hm.id = "baidu_tj";
      var s = document.getElementsByTagName("script")[0];
      s.parentNode.insertBefore(hm, s);
    })();
  })
}

id换成自己的，然后在nuxt.config,js中引入文件

开发spa应用

在nuxt.config.js中添加：

mode: 'spa'

全局mixins

在plugins文件夹下添加mixins.js

import Vue from 'vue'
Vue.mixin({
  methods: {
   getData(url, param = {}) {
      var self = this
      return new Promise(function (resolve, reject) {
        self.$axios({
          method: 'post',
          url: url,
          headers: {
            'Content-Type': 'application/x-www-form-urlencoded'
          },
          // 启用cookie
          withCredentials: true,
          data: param,
          params: param
        }).then((ret) => {
          const { data } = ret
          resolve(data)
        })
      })
    }
  }
})

全局组件

在plugins文件夹下添加components.js

import Vue from 'vue'
import TopTip from '../components/top-tip.vue'

const components = { TopTip, }

Object.keys(components).forEach(key => {
  Vue.component(key, components[key])
})

全局过滤器

在plugins文件夹下添加filters.js

import Vue from 'vue'

export function formatDate(date, fmt) {
  let newDate = new Date(date)
  if (/(y+)/.test(fmt)) {
    fmt = fmt.replace(RegExp.$1, (newDate.getFullYear() + '').substr(4 - RegExp.$1.length))
  }
  let o = {
    'M+': newDate.getMonth() + 1,
    'd+': newDate.getDate(),
    'h+': newDate.getHours(),
    'm+': newDate.getMinutes(),
    's+': newDate.getSeconds()
  }
  for (let k in o) {
    if (new RegExp(`(${k})`).test(fmt)) {
      let str = o[k] + ''
      fmt = fmt.replace(RegExp.$1, (RegExp.$1.length === 1) ? str : padLeftZero(str))
    }
  }
  return fmt
}

function padLeftZero(str) {
  return ('00' + str).substr(str.length)
}


const filters = { formatDate}

Object.keys(filters).forEach(key => {
  Vue.filter(key, filters[key])
})

export default filters