#typescript #sharepoint #client-side #web-parts
#typescript #sharepoint #на стороне клиента #веб-части
Вопрос:
Я создаю пользовательскую веб-часть на стороне клиента для sharepoint. На панели редактирования при нажатии кнопки я хотел бы добавить больше html после кода в методе рендеринга, но когда код добавляется к html в методе рендеринга, он немедленно удаляется и заменяется жестко запрограммированным.
export default class ContentCardWebPart extends BaseClientSideWebPart<IContentCardWebPartProps> {
public render() {
this.domElement.innerHTML = `
<div class="${ styles.contentCard }">
<div class="${ styles.container }">
<div class="${ styles.row }">
<div id="contentCard" class="${ styles.column }">
<span class="${ styles.title }">Welcome to SharePoint!</span>
<p class="${ styles.subTitle }">Customize SharePoint experiences using Web Parts.</p>
<p class="${ styles.description }">${escape(this.properties.description)}</p>
<a href="https://aka.ms/spfx" class="${ styles.button }">
<span class="${ styles.label }">Learn more</span>
</a>
</div>
</div>
</div>
</div>`;
}
protected get dataVersion(): Version {
return Version.parse('1.0');
}
private ButtonClick() {
var myDiv = document.createElement("div");
myDiv.innerHTML = `<div>${this.properties.description}</div>`;
document.getElementById("contentCard").appendChild(myDiv);
}
метод нажатия кнопки связан с кнопкой, которая появляется на панели редактирования и работает при добавлении кода в document.body, но не с каким-либо кодом, присутствующим в функции рендеринга. пожалуйста, помогите, как я могу изменить этот код с помощью JavaScript?
Ответ №1:
Вам нужно включить нереактивный режим, добавить следующий код в свою веб-часть:
protected get disableReactivePropertyChanges(): boolean {
return true;
}
Комментарии:
1. Спасибо, в итоге я решил эту проблему, установив внутренний HTML-код DOMElement за один раз без цикла, который использовал =, что, казалось, сработало