关于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>

评论

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

这个站点使用 Akismet 来减少垃圾评论。了解你的评论数据如何被处理