乐趣区

关于vue.js:vuei18n国际化之css国际化

这两天在搞一个商城国际化的我的项目,期间解决了 N 个问题吧例如 vue 中国际化 js 中国际化
接口内容国际化等等,明天次要说的就是 css 中内容的国际化看图:

after css

这里的 个 张 元 应用 css3 after 追加进去的,咱们晓得 after 其实就是在前面追加一个
行内元素而已,那么我咱们就把这段 css 提取进去换成等价的代码即可拉
这里咱们应用 <text></text> 来替换拉,完满解决此问题

<template>
    <!-- 钱包卡片 -->
    <view class="sh-wallet-box u-flex u-m-b-10 u-p-r-20">
        <view class="u-flex wallet-left">
            <view class="wallet-item u-flex-col u-col-center" @tap="jump('/pages/user/wallet/index')">
                <text class="wallet-item__detail item-balance u-ellipsis-1">{{userInfo.money || '0'}}<text style="font-size: 16rpx;margin-left: 4rpx;">{{userLocale.yuan}}</text></text>
                <text class="wallet-item__title">{{userLocale.zhanghuyuer}}</text>
            </view>
            <view class="wallet-item u-flex-col u-col-center" @tap="jump('/pages/user/wallet/score-balance')">
                <text class="wallet-item__detail item-score u-ellipsis-1">{{userInfo.score || '0'}}<text style="font-size: 14rpx;margin-left: 4rpx;">{{userLocale.ge}}</text></text>
                <text class="wallet-item__title">{{userLocale.jifen}}</text>
            </view>
            <view class="wallet-item u-flex-col u-col-center" @tap="jump('/pages/app/coupon/list')">
                <text class="wallet-item__detail item-coupon u-ellipsis-1">{{userOtherData.coupons_num || '0'}}<text style="font-size: 16rpx;margin-left: 4rpx;">{{userLocale.zhang}}</text></text>
                <text class="wallet-item__title">{{userLocale.youhuiquan}}</text>
            </view>
        </view>
        <view class="wallet-item u-flex-col wallet-right u-col-center" @tap="jump('/pages/user/wallet/index')">
            <image class="cut-off--line" :src="$IMG_URL +'/imgs/user/cut_off_line.png'"mode=""></image>
            <image class="wallet-img" :src="$IMG_URL +'/imgs/user/wallet.png'"mode="aspectFill"></image>
            <text class="wallet-item__title">{{userLocaleqianbao}}</text>
        </view>
    </view>
</template>
退出移动版