vue-i18n this.$tc不是函数 - 腾讯云开发者社区

文章/答案/技术大牛

发布

【源码】Vue-i18n: 你知道国际化是怎么实现的么？

其中左侧是 Vue-i18n 提供的一些方法、组件、自定义指令等能力，右侧是 Vue-i18n 对数据的管理 ?...numberComponent.name, numberComponent) 注册完成后，会调用 _initVM，这个主要是创建了一个 Vue 实例对象，后面很多功能会跟这个 this._ vm 相关联 // VueI18n 其实不是一个...$t = function (key: Path, ...values: any): TranslateResult { const i18n = this...._i18n) { return } const self = this this.$nextTick(() => { if (self....// 主要是调用了 t 方法和 tc 方法 if (choice != null) { el._vt = el.textContent = vm.

3.6K4 0

【源码】Vue-i18n: 你知道国际化是怎么实现的么？

numberComponent.name, numberComponent) 注册完成后，会调用 _initVM，这个主要是创建了一个 Vue 实例对象，后面很多功能会跟这个 this._ vm 相关联 // VueI18n 其实不是一个...$t = function (key: Path, ...values: any): TranslateResult { const i18n = this...._i18n) { return } const self = this this.$nextTick(() => { if (self....// 主要是调用了 t 方法和 tc 方法 if (choice != null) { el._vt = el.textContent = vm....从 Vue-i18n 中，我学习到了国际化翻译 Vue-i18n 的架构组织和 $t 的原理，当遇到插值对象的时候，需要进行 parse 和 compile Vue-i18n 通过转义字符避免 XSS

2.5K1 0

您找到你想要的搜索结果了吗？

是的

没有找到

vue多语言插件vue-i18n使用介绍

详细步骤安装vue-i18n npm install vue-i18n -S 引入在main.js中引入vue-i18n import VueI18n from 'vue-i18n' Vue.use...初始化 const i18n = new VueI18n({ locale: 'cn', // 默认语言 messages }) vue-i18n挂载到vue实例 new Vue({ el:...App } }) vue模板文件中使用 {{ $t("message.hello") }} js中使用 computed:{ hello(){ return this...$t("message.hello") + this.$t("message.author"); } } 切换语言 this....$i18n.locale = 'en' // 切换英文单独定义语言文件并加载到vue-i18n初始化中 // cn.js export default { message: { hello

1.7K3 0

vue2升级vue3：vue2 vue-i18n 升级到vue3搭配VueI18n v9

": "^8.26.8",import Vue from 'vue';import VueI18n from 'vue-i18n';import chineseJson from '.....window.i18n = i18n;export default i18n;注意：globalInjection 为true使用注意事项：在vue模板()中与 defineComponent render 函数中直接使用...this.... return ( {this...$t('国际化示例')} ); },});但是在step 函数中，需要import { defineComponent } from

9611 0

Vue I18n 在 Vuetify 项目中使用

官网 http://kazupon.github.io/vue-i18n/zh/introduction.html https://vuetifyjs.com/en/features/internationalization...安装 cdn vue-i18n.../dist/vue-i18n.js"> npm npm install vue-i18n yarn yarn add vue-i18n vue-i18n 在 vue 单页面中使用...$t("message.li1"), // 获取 i18n 配置数据 }, { title: this....$t("message.li2"), }, { title: this.

1.9K5 0

Vue项目实战05：18n实现多语言自动切换-浏览器语言设置「建议收藏」

什么是vue-i18n i18n是 Internationalization 这个英文的简写，即国际化的意思，vue-i18n是一款针对于vue开发的国际化插件,让项目支持多语言切换，以适应不同地区用户的需求...安装vue-i18n 直接在项目中执行安装命令：npm install vue-i18n --save 全局引入vue-i18n 在项目中引入vue-i18n，实例化vue-i18n将需要加载的语言包通过...//动态渲染 computed:{ navlist(){ return this....$t('nav') } } ---- ---- 以上是根据浏览器自动切换语言点击切换 //手动切换语言 change(){ if (this....$i18n.locale === 'zh-CN') { this.

3K2 0

Vue I18n 实现多语种

公司疫情监测终端管理平台需要国际化，于是我找到了vue-i18n。...安装 yarn add vue-i18n 引入 import Vue from 'vue' import VueI18n from 'vue-i18n' Vue.use(VueI18n) main.ts...中配置词库 const i18n = new VueI18n({ locale: 'zh', // 通过 this....$i18n.locale }} // 简单中英切换 handlerChangeLang() { if (this....$i18n.locale === "zh") { this.$i18n.locale = "en"; } else { this.

4863 0

在Vue中如何处理国际化(i18n)需求？分享一下实践经验

在Vue中处理国际化需求，可以借助于Vue的插件vue-i18n来实现。下面将分享一些我在处理国际化需求时的实践经验。 1、安装和配置vue-i18n：首先，需要安装vue-i18n插件。...在项目的根目录下使用npm或yarn命令进行安装： npm install vue-i18n 然后，在Vue应用的入口文件（通常是main.js）中引入并配置vue-i18n： import Vue from...vue-i18n插件提供了i18n.locale属性和i18n.setLocale方法来实现语言切换。...} export default { methods: { changeLocale(locale) { this...vue-i18n提供了this.$t方法的第二个参数，可以传入一个对象来替换翻译内容中的占位符。

1.4K1 0

vue 项目中英文切换

最近vue项目需要中英文切换，查了资料，发现大部分都是采用 vue-i18n，但是写的比较简单，大部分都是全局引入语言包，遇到的几个问题 1、如何结合element-ui 实现中英文切换 2、如何在组件中使用各自的语言包...3、中英文切换如何刷新页面，特别是中英文切换时根据当前语言调用中文或者英文接口全局引入语言包实现中英文切换一、安装vue-i18n，我安装的版本是 "vue-i18n": "^8.22.0",...npm install --save vue-i18n 新建一个common文件夹，里面含有如下文件 ?...a925:33 [vue-i18n] Value of key 'person.age' is not a string or function !...[vue-i18n] Fall back to translate the keypath 'person.age' with root locale.

3.4K3 0

初识ABP vNext（6）：vue+ABP实现国际化

ABP后端支持的是本地化，而vue-element-admin支持的是国际化，使用vue-i18n实现；本文默认它两者是一回事。前面的章节中，已经大概分析了vue+ABP国际化的实现思路。...$i18n.locale = lang this.$store.dispatch("app/setLanguage", lang); this....$store.dispatch("app/applicationConfiguration").then(() => { this....接下来只需要把界面上对应的文本使用vue-i18n的$t()方法渲染就好了，比如： ? 前端需要改动的地方比较多，但都是类似的修改。。。直接看效果： ? ? ?...而vue-i18n是支持多层级的： ? 所以ElementUI的这部分文本还是放在前端了。最后本篇关于vue+ABP实现国际化就介绍完了。。。

1.8K1 0

Ant-design-vue+vue-i18n实现前端国际化

此时做国际化需要考虑两方面的国际化，一是ant-design-vue内部组件的国际化，二是国际化我们的业务显示，业务显示我们选用vue-i18n进行国际化。...安装vue-i18n yarn add vue-i18n 在public文件夹下新建languages文件夹，在新建langs文件夹和i18n.js，langs文件夹下新建index.js、cn.js、...$on("switchLanguage", value => { let router_path = this....调用方法如下： this.$root.Bus.$emit("switchLanguage", "cn/en"); 解释下this.$root.Bus....$i18n.locale = localStorage.lang }, src下新建languages文件夹，下面分模块页面切换多语言这样就完成了Ant-design-vue + vue-i18n

4.8K18 13

vue国际化vue-i18n简单使用

当然是直接用插件了，并不是自己实现 vue-i18n使用很简单：安装依赖：npm i vue-i18n -S 引入、调用： import VueI18n from 'vue-i18n'; Vue.use...直接使用： {{$t('lang.login')}} 切换语言： this.$i18n.locale = type; 效果： ?...当然，vue-i18n还提供了其他属性和方法，只是官网我打不开，没办法多说一些。 element-ui也是通过切换语言文件实现的。...至于vue官网的，我看见是直接地址都变了，也不知道是不是采用这种思路，直接替换文本内容。（完）

1.1K1 0

前端国际化辅助工具——自动替换中文并翻译

这些配置项都不是必要的，如果你需要翻译功能，一般只需要填入 appid、key 并且将 translation 设为 true。...$t('0')} placeholder={this.$t('1')} value={`s ${this....$t('4')}{` ${this.$t('3')}`} {`${this.$t('3')} `}{this....这个 loader 是一个本地文件地址，你提供的文件需要写一个转换函数，将其他格式的文件转换成 i18n-replace 要求的数据格式，就像下面这个函数一样： const excelToJson =...例如 vue-i18n 国际化工具使用的是 $t，而 react-i18next 使用的是 t。 translation 是否需要自动翻译，默认为 false。

4.1K3 0

oracle 不是单组分组函数查询条数,oracle不是单组分组函数不是单组分组函数怎么解决…

oracle ORA-00937: 非单组分组函数？这种错误报告通常使用聚合函数，如count和sum，但不使用groupby来声明分组模式。例如，有一个学生表。...正确的书写方法是：选择班级号，从学生表中按班级号分组计数(学生号) 不是单一的分组函数。通常，当在数据库中执行查询语句，并且不定期使用sum、AVG和count等聚合函数时，会报告错误。

4.2K3 0

如何在vue项目中支持多种语言

如何加载到全局呢，在Vue的项目中，就需要用到Vue-i18n这个模块。代码如下： main.js import Vue from 'vue' import App from '..../App' import VueI18n from 'vue-i18n' const messages = { en: { message: { hello: 'world hello'...h1>{{$t("message.hello")}} export default { created () { console.log(this...$t("message.hello")) } } 打印结果为世界，因为在创建vue-i18n实例的过程中我们传入了两个参数，local和messages...然后在实例化组件的过程中将i18n传入，这样组件中就可以访问$t这个函数了，通过这个函数，我们可以取出messages中的属性值，将其渲染到页面中。

1.4K4 0

Vue-i18n 国际化

基本使用安装 npm install –save vue-i18n 创建lang 文件夹 index.js中引入 i18n并使用 import Vue from 'vue' import VueI18n...from 'vue-i18n' Vue.use(VueI18n) const i18n = new VueI18n({ // 设置当前语言 locale: 'zh', messages...$i18n.locale == 'zh') { this.$i18n.locale = 'en' } else { this....; }, langZh(){ this....$i18n.locale) }, changeLang(){ if(this.$i18n.locale == 'zh'){ this.

9551 0

不是单组分组函数

问题：一： SELECT tablespace_name, SUM(bytes) free FROM dba_free_space 不是单组分组函数原因： 1、如果程序中使用了分组函数...tablespace_name, SUM(bytes) free FROM dba_free_space GROUP BY tablespace_name ；如果不使用分组的活，则只能单独使用分组函数...改为： SELECT SUM(bytes) free FROM dba_free_space ； 2、在使用分组函数的时候，不能出现分组条件之外的字段总结：在 select 需要查询的语句中选中的字段

3.7K2 0

vue-i18n国际化语言在项目中的使用

目前在各大商城项目中，对于国际化语言的需求越来越高了，其中最多的就是vue项目使用i18n插件实现多语言切换功能，最近有幸我刚好做了这方面的业务，下面是我对vue-i18n国际化语言的一点总结与记录正文项目中通常通过选择语言...1.引入多语言首先在main.js中进行引入并注册vue-i18n，引入中文语言包和英文语言包（根据开发需求引入语言包）//main.js//多语言引入import VueI18n from 'vue-i18n'import...$i18n.locale=='zh-Hans'){ this....$i18n.locale=='en'){ this..../zh-Hans.json'import Vue from 'vue'; import VueI18n from 'vue-i18n'Vue.use(VueI18n)const i18n = new VueI18n

1.7K5 0

统计函数与通配符相爱，不是意外！

但是统计函数和通配符相爱，却是一种必然！统计函数何许人也：Sumif、Countif、AverageIf、Sumifs、Countifs、Averageifs，概括一下他们的用法！...统计函数与通配符的搭配使用，可以大大拓展统计函数的应用场景！

3.8K6 0

Vue项目i18n国际化语言切换

本篇分两部分，第一部分为vue+i18n国际化，第二部分是怎样适配element的国际化，第三部分为使用方法效果预览源码参考第一部分：Vue+i18n 1.安装依赖 npm install vue-i18n...en: en, cn: cn }; 5.编辑i18n.js文件 //引入vue import Vue from "vue"; //引入i18n语言包 import VueI18n from "vue-i18n...变量使用 4.实现切换 //切换语言 methods: { switchLang() { this.$i18n.locale == "cn" ? (this....$i18n.locale = "en") : (this.$i18n.locale = "cn"); } } 效果预览源码参考

3.1K1 0

点击加载更多

【源码】Vue-i18n: 你知道国际化是怎么实现的么？

【源码】Vue-i18n: 你知道国际化是怎么实现的么？

vue多语言插件vue-i18n使用介绍

vue2升级vue3：vue2 vue-i18n 升级到vue3搭配VueI18n v9

Vue I18n 在 Vuetify 项目中使用

Vue项目实战05：18n实现多语言自动切换-浏览器语言设置「建议收藏」

Vue I18n 实现多语种

在Vue中如何处理国际化(i18n)需求？分享一下实践经验

vue 项目中英文切换

初识ABP vNext（6）：vue+ABP实现国际化

Ant-design-vue+vue-i18n实现前端国际化

vue国际化vue-i18n简单使用

前端国际化辅助工具——自动替换中文并翻译

oracle 不是单组分组函数查询条数,oracle不是单组分组函数不是单组分组函数怎么解决…

如何在vue项目中支持多种语言

Vue-i18n 国际化

不是单组分组函数

vue-i18n国际化语言在项目中的使用

统计函数与通配符相爱，不是意外！

Vue项目i18n国际化语言切换

相关资讯

热门标签

活动推荐

运营活动

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐