vue 點擊修改樣式

1.頁面加載默認一個初始的isact,讓第二個div.f具有一個on的類；在點擊的時候，傳入一個值給data.isact

<template>
    <nav class="clearfix">
      <div class="fl" :class="{on:'zh'==isact}" @click="refresh(); changeLangEvent('zh')" v-text="$t('m.p_0002')"></div>
      <div class="fl" :class="{on:'en'==isact}" @click="refresh(); changeLangEvent('en')" v-text="$t('m.p_0003')"></div>
    </nav>
</template>

export default {
  name: 'Login',
  data () {
    return {
      'isact': 'en', // 索引為0的tab添加 class='on',此處應該由內存中獲取
    }
  },
  methods: {
    'refresh': refresh,
    'changeLangEvent': changeLangEvent
  }
}
/**
 * 切換語言
 * */
function changeLangEvent (lang) {
  if (lang === 'en') {
    this.$i18n.locale = 'en'
    this.$validator.locale = 'en' // 表單驗證提示語言設置為'en'
  } else {
    this.$i18n.locale = 'zh'
    this.$validator.locale = 'zh'
  }
  localStorage.setItem('language', lang)
  this.isact = lang
}

 2.利用mint-ui的控件，可以雙向綁定

<template>
　　<mt-tab-container v-model="selected">
      <mt-tab-container-item id="T">
      </mt-tab-container-item>
      <mt-tab-container-item id="P">
      </mt-tab-container-item>
    </mt-tab-container>
</template>

export default {
  name: 'ProjectList',
  data () {
    return {
      selected: 'T'23     }
  }37 }

3.待續