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

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>

dandelion
1 声望0 粉丝