uniapp 使用vue-i18n实现传入变量国际化

实现传入变量,做对应的国际化

  • zh-ch.js
export default {
  "my.ll": "你好,我是{name},性别:{sex}"
}
  • en.js
export default {
    "my.ll": "Hello, I am {name},sex:{sex}"
}

一、直接插入变量

Vue组件中使用如下:

 <p>{{$t('my.ll', {name:'123',sex:'666'})}}</p>

二、变量以HTML的形式插入

<template>
    <div>
        <span>Hello,</span>
        <i18n path="my.ll" :tag="false">
          <template slot="name">
            <span style="color:red">1231</span>
          </template>
          <template slot="sex">
            <span style="color:red">888</span>
          </template>
        </i18n>
    </div>
</template>

相关推荐

  1. uniapp 使用vue-i18n实现传入变量国际化

    2024-03-11 02:28:02       48 阅读
  2. i18nVUE3中使用插槽动态传入组件

    2024-03-11 02:28:02       34 阅读

最近更新

  1. docker php8.1+nginx base 镜像 dockerfile 配置

    2024-03-11 02:28:02       94 阅读
  2. Could not load dynamic library ‘cudart64_100.dll‘

    2024-03-11 02:28:02       100 阅读
  3. 在Django里面运行非项目文件

    2024-03-11 02:28:02       82 阅读
  4. Python语言-面向对象

    2024-03-11 02:28:02       91 阅读

热门阅读

  1. 蓝桥杯2023年-接龙数列(dp)

    2024-03-11 02:28:02       43 阅读
  2. c++ 类内可以定义引用数据成员吗?

    2024-03-11 02:28:02       47 阅读
  3. 代码审查语录

    2024-03-11 02:28:02       38 阅读
  4. 2024年AI辅助研发:科技新贵,工业变革的先锋

    2024-03-11 02:28:02       47 阅读
  5. 第1周 Python语法基础刷题

    2024-03-11 02:28:02       40 阅读
  6. 脚手架原理之webpack处理html文件和模块打包

    2024-03-11 02:28:02       43 阅读
  7. 安卓okhttp网络请求封装使用

    2024-03-11 02:28:02       33 阅读
  8. 一周速递|全球车联网产业动态(2024年3月10日)

    2024-03-11 02:28:02       52 阅读
  9. HTML笔记3

    2024-03-11 02:28:02       38 阅读
  10. 强化学习(一)

    2024-03-11 02:28:02       44 阅读
  11. P1536 村村通题解

    2024-03-11 02:28:02       45 阅读