language.vue 1.2 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162
  1. <template>
  2. <view class="content">
  3. <view class="list">
  4. <view class="list-item flex" v-for="(item, index) in list" @click="change(item.type)">
  5. <view class="item-left">{{ item.name }}</view>
  6. <view class="item-right" v-if="language == item.type"><image src="../../static/img/gou.png" mode=""></image></view>
  7. </view>
  8. </view>
  9. </view>
  10. </template>
  11. <script>
  12. export default {
  13. data() {
  14. return {
  15. language: '',
  16. list: [{ name: '繁體中文', type: 'zh_tw' }, { name: 'English', type: 'en' },{name: '日本语',type: 'ja'},{name: '한국어',type: 'kor'}]
  17. };
  18. },
  19. onLoad() {
  20. let lang = uni.getStorageSync('lang');
  21. if (lang) {
  22. this.language = lang;
  23. }
  24. },
  25. onShow() {},
  26. methods: {
  27. change(type) {
  28. this._i18n.locale = type;
  29. this.language = type;
  30. uni.setStorageSync('lang', type);
  31. uni.switchTab({
  32. url: '/pages/index/index'
  33. });
  34. }
  35. }
  36. };
  37. </script>
  38. <style lang="scss">
  39. page,
  40. .content {
  41. min-height: 100%;
  42. height: auto;
  43. background: #fff;
  44. }
  45. .list-item {
  46. padding: 40rpx 20rpx;
  47. .item-left {
  48. font-size: 36rpx;
  49. color: #707a8a;
  50. }
  51. .item-right {
  52. width: 36rpx;
  53. height: 36rpx;
  54. image {
  55. width: 100%;
  56. height: 100%;
  57. }
  58. }
  59. }
  60. </style>