fix(widget): 修复评论列表无评论时的文案显示问题
- 将硬编码的“暂无评论,快来抢沙发吧!”文案移至国际化文件,便于统一管理 - 在 CommentList 构造函数中注入翻译函数,确保组件能正确使用国际化文案 - 调整语言选择逻辑,优先使用用户配置的语言,其次使用服务器配置,最后自动检测 - 在开发工具中增加语言选择配置项,便于测试不同语言环境
This commit is contained in:
@@ -35,6 +35,7 @@ export class CommentList extends Component {
|
||||
*/
|
||||
constructor(container, props = {}) {
|
||||
super(container, props);
|
||||
this.t = props.t || ((k) => k);
|
||||
this.loadingComponent = null;
|
||||
this.paginationComponent = null;
|
||||
this.commentItems = new Map(); // 缓存 CommentItem 实例,key 为 comment.id
|
||||
@@ -120,7 +121,7 @@ export class CommentList extends Component {
|
||||
const emptyEl = this.createElement('div', {
|
||||
className: 'cwd-empty',
|
||||
children: [
|
||||
this.createTextElement('p', '暂无评论,快来抢沙发吧!', 'cwd-empty-text')
|
||||
this.createTextElement('p', this.t('noComments'), 'cwd-empty-text')
|
||||
]
|
||||
});
|
||||
root.appendChild(emptyEl);
|
||||
|
||||
@@ -169,7 +169,7 @@ export class CWDComments {
|
||||
});
|
||||
|
||||
// 设置语言
|
||||
let lang = serverConfig.widgetLanguage || 'auto';
|
||||
let lang = this.config.lang || serverConfig.widgetLanguage || 'auto';
|
||||
if (lang === 'auto' && typeof navigator !== 'undefined') {
|
||||
const browserLang = navigator.language || navigator.userLanguage;
|
||||
if (browserLang.toLowerCase().startsWith('en')) {
|
||||
@@ -194,7 +194,7 @@ export class CWDComments {
|
||||
}
|
||||
} else {
|
||||
// 即使没有域名限制,也需要设置语言
|
||||
let lang = serverConfig.widgetLanguage || 'auto';
|
||||
let lang = this.config.lang || serverConfig.widgetLanguage || 'auto';
|
||||
if (lang === 'auto' && typeof navigator !== 'undefined') {
|
||||
const browserLang = navigator.language || navigator.userLanguage;
|
||||
if (browserLang.toLowerCase().startsWith('en')) {
|
||||
|
||||
@@ -51,12 +51,14 @@ function populateInputs(config) {
|
||||
const avatarPrefixInput = document.getElementById('avatarPrefix');
|
||||
const siteIdInput = document.getElementById('siteId');
|
||||
const postSlugInput = document.getElementById('postSlug');
|
||||
const langSelect = document.getElementById('lang');
|
||||
|
||||
if (apiBaseUrlInput) apiBaseUrlInput.value = config.apiBaseUrl || DEFAULT_CONFIG.apiBaseUrl;
|
||||
if (themeSelect) themeSelect.value = config.theme || DEFAULT_CONFIG.theme;
|
||||
if (avatarPrefixInput) avatarPrefixInput.value = config.avatarPrefix || DEFAULT_CONFIG.avatarPrefix;
|
||||
if (siteIdInput) siteIdInput.value = config.siteId || DEFAULT_CONFIG.siteId || '';
|
||||
if (postSlugInput) postSlugInput.value = config.postSlug || DEFAULT_CONFIG.postSlug || '';
|
||||
if (langSelect) langSelect.value = config.lang || DEFAULT_CONFIG.lang;
|
||||
}
|
||||
|
||||
/**
|
||||
@@ -67,7 +69,8 @@ function getConfigFromInputs() {
|
||||
const theme = document.getElementById('theme')?.value || DEFAULT_CONFIG.theme;
|
||||
const siteId = document.getElementById('siteId')?.value || DEFAULT_CONFIG.siteId || '';
|
||||
const postSlug = document.getElementById('postSlug')?.value || DEFAULT_CONFIG.postSlug || '';
|
||||
return { apiBaseUrl, theme, siteId, postSlug };
|
||||
const lang = document.getElementById('lang')?.value || DEFAULT_CONFIG.lang;
|
||||
return { apiBaseUrl, theme, siteId, postSlug, lang };
|
||||
}
|
||||
|
||||
/**
|
||||
@@ -98,6 +101,7 @@ async function initWidget() {
|
||||
apiBaseUrl: config.apiBaseUrl,
|
||||
siteId: config.siteId,
|
||||
postSlug: config.postSlug,
|
||||
lang: config.lang,
|
||||
});
|
||||
widgetInstance.mount();
|
||||
} catch (error) {}
|
||||
|
||||
@@ -64,7 +64,7 @@ export const locales = {
|
||||
verifyAdmin: '退出验证',
|
||||
formTitle: '发表评论',
|
||||
loadMore: '加载更多',
|
||||
noComments: '暂无评论',
|
||||
noComments: '暂无评论,快来抢沙发吧!',
|
||||
delete: '删除',
|
||||
confirmDelete: '确定删除这条评论吗?',
|
||||
deleteSuccess: '删除成功',
|
||||
|
||||
Reference in New Issue
Block a user