问卷调查设计-SurveyJS的使用(汉化)

688 阅读2分钟

开启掘金成长之旅!这是我参与「掘金日新计划 · 12 月更文挑战」的第1天,点击查看活动详情

书接上回,创建Survey设计器后,接下来就是实现问卷的本地化

本地化 Survey Creator

上来先踩坑

官方提供的文档是这样写的

image.png

当你按照文档中的步骤进行时会产生疑问 这里的 SurveyCreator 是哪里取到的呢,上一篇文章我们创建设计面板时是不是用到过,继续执行,代码报红

image.png

报错提示SurveyCreator身上不存在localization这个方法,这就让人无奈了,官方文档还能出错...

于是看着文档各种揣摩通过这种方式

import { localization } from 'survey-creator-core'

import { surveyLocalization } from 'survey-core'

surveyLocalization.supportedLocales = ['zh-cn']

surveyLocalization.defaultLocale = 'zh-cn'

localization.currentLocale = 'zh-cn'

const translations = localization.getLocale('zh-cn')

基本实现了本地化,但是SurveyJS汉化不完全,界面放眼望去还是存在很多没有转换的文字

image.png

这怎么办呢???

官方文档告诉我们可以覆盖单个翻译,那我怎么找到我想要修改的字段在哪呢,这个文档不想多吐槽了,毕竟人家英文文档,可能使用习惯不同吧,于是我找啊找,你猜在哪里找到了...😂😂😂

第一步点击文档下的界面本地化演示

image.png

第二步点击演示面板上的文档

image.png

第三步点击文档中的文件链接

image.png

第四步找到你需要修改的文字

image.png

第五步进行修改

这里我们可以先执行,方便找到对应的字段来进行修改

console.log(translations)

image.png

到这里就结束了吗? 别忘了这只是我们的踩坑之路,完成上面的操作后你会发现这里怎么修改都发生不了变化。

image.png

正确的做法

1.引入本地化模块

import 'survey-core/survey.i18n'
import 'survey-creator-core/survey-creator-core.i18n'

2. 改变默认语言

import { localization } from 'survey-creator-core'
const translations = localization.getLocale('zh-cn')

3. 同上覆盖单个翻译

translations.ed.logic = '逻辑'

吐槽

踩了那么久的坑,绕了那么长的路,正确的做法怎么来的呢???😒😒😒

邮件咨询SurveyJS开发人员,听不懂我的需求(可能是汉译英的锅,哈哈),给了我一个链接让我把问题代码敲一下,结果正确方法在这里,真是让人哭笑不得,希望我的踩坑,能为大家提供一点帮助

千辛万苦汉化结束了,接下来开启定制之旅