| <template> |
| <el-dropdown trigger="click" class="international" @command="handleSetLanguage"> |
| <div> |
| <svg-icon class-name="international-icon" icon-class="language" /> |
| </div> |
| <el-dropdown-menu slot="dropdown"> |
| <el-dropdown-item :disabled="language==='zh'" command="zh">中文</el-dropdown-item> |
| <el-dropdown-item :disabled="language==='en'" command="en">English</el-dropdown-item> |
| </el-dropdown-menu> |
| </el-dropdown> |
| </template> |
| |
| <script> |
| export default { |
| computed: { |
| language() { |
| return this.$store.getters.language |
| } |
| }, |
| methods: { |
| handleSetLanguage(lang) { |
| this.$i18n.locale = lang |
| this.$store.dispatch('setLanguage', lang) |
| this.$message({ |
| message: 'Switch Language Success', |
| type: 'success' |
| }) |
| } |
| } |
| } |
| </script> |
| |
| <style scoped> |
| .international-icon { |
| font-size: 20px; |
| cursor: pointer; |
| vertical-align: -5px!important; |
| } |
| </style> |
| |