uzzuz

Nuxt 模块库

https://github.com/topics/nuxt-module

i18n 国际化

https://域名/zh 自动转到中文站点 https://域名/en 自动转到英文站点

CSS 库

在线扒网站

https://bazhan.wang/

特效库

https://www.delac.io/WOW/docs.html 会自动依赖 animate.css

映射

Hostsman www.door.com

服务

live-server --open=/ --port=8001
live-server --open=/ --port=9999

VUEX

import { mapGetters } from 'vuex'

// 使用对象展开运算符将 getter 混入 computed 对象中  并设置别名
...mapGetters({
  // 把 `this.doneCount` 映射为 `this.$store.getters.doneTodosCount`
  getImage: 'env/getImage',
}),

代码片段

预置字段

// ============================== 标准组件预置字段 Start ==============================
componentReady: false,
params: {}, // 组件参数
channelList: [], // 频道列表
currentChannelName: '', // 当前频道名
// ==============================  标准组件预置字段 End  ==============================

Nuxt-Link

<nuxt-link
  v-for="categoryItem in channelItem.categoryList"
  :key="$options.name + '_' + categoryItem.id"
  :to="{
    path: componentUtil.generateHref($store, channelItem.name),
    query: { categoryId: categoryItem.id },
  }"
  >{{ categoryItem.title }}</nuxt-link
>

json 字符串数组

"channelList": {
  "title": "显示频道列表",
  "type": "array",
  "default": [
    "about"
  ],
  "items": {
    "type": "string"
  },
  "uniqueItems": false
}

json 对象数组

"cardList": {
  "type": "array",
  "title": "一个对象数组",
  "items": {
    "type": "object",
    "properties": {
      "name": {
        "title": "Thing",
        "type": "string",
        "default": "Default na"
      }
    }
  }
},

html 换行

white-space: pre-line;

i18n 国际化

<i18n src="./lan.json"></i18n>
{{ $t('fax') }}

key 前缀

$options.name + '_' +

computeImage

return {
  background:
    'url(' +
    this.componentUtil.static(this.params.imageBackground) +
    ') no-repeat center',
}