<template>
  <div class="abc">
    <div>这是一个测试页面{{test}}</div>
    <!-- 外部引入字体库 -->
    <div class="el-icon-self-star_full"></div>
    <!-- 页面引入的两种方式 -->
    <img :src="require('@/assets/images/logo.png')" alt="">
    <img src="@/assets/images/logo.png" alt="">
    <!-- 切换中英文 -->
    <div @click="changeLanguage">切换中英文：{{ $t('common.title') }}</div>
    <!-- css图片引入 -->
    <div class="bg-img"></div>
    <normal></normal>
  </div>
</template>

<script>
import action from '@action'

export default {
  data () {
    return {
      test: 'abc'
    }
  },
  metaInfo () {
    return {
      title: '独立 - 标题',
      meta: [
        // { vmid: 'description', name: 'description', content: this.description }
      ]
    }
  },
  mounted () {
    /* 接口请求测试 */
    action.Test.getTest('1').then((res) => {
      console.log(res)
    })
  },
  methods: {
    changeLanguage () {
      this.$i18n.locale = (this.$i18n.locale === 'cn' ? 'en' : 'cn')
    }
  }
}
</script>

<style lang="scss" scoped>
  .bg-img {
    width: 134px;
    height: 44px;
    background: url('~@/assets/images/logo.png') no-repeat;
  }
</style>
