Default property values not working in SPFx web part
-
16-02-2021 - |
Frage
I have 3 web part properties set up in my spfx web part. However it is not showing the default values I have set
{
"$schema": "https://developer.microsoft.com/json-schemas/spfx/client-side-web-part-manifest.schema.json",
"id": "d1587168-2126-44f1-bc7d-cfa4cc5108ed",
"alias": "MainArticlesWebPart",
"componentType": "WebPart",
// The "*" signifies that the version should be taken from the package.json
"version": "*",
"manifestVersion": 2,
// If true, the component can only be installed on sites where Custom Script is allowed.
// Components that allow authors to embed arbitrary script code should set this to true.
// https://support.office.com/en-us/article/Turn-scripting-capabilities-on-or-off-1f2c515f-5d7e-448a-9fd7-835da935584f
"requiresCustomScript": false,
"supportedHosts": ["SharePointWebPart"],
"preconfiguredEntries": [{
"groupId": "5c03119e-3074-46fd-976b-c60198311f70", // Other
"group": { "default": "Other" },
"title": { "default": "Main Articles" },
"description": { "default": "Main Articles description" },
"officeFabricIconFontName": "Page",
"properties": {
"description": "Show the main articles.",
"list_title": "Main Articles",
"site_url": ""
}
}]
}
and in the .ts file
import * as React from 'react';
import * as ReactDom from 'react-dom';
import { Version } from '@microsoft/sp-core-library';
import {
IPropertyPaneConfiguration,
PropertyPaneTextField
} from '@microsoft/sp-property-pane';
import { BaseClientSideWebPart, WebPartContext } from '@microsoft/sp-webpart-base';
import * as strings from 'MainArticlesWebPartStrings';
import { MainArticles } from './components/MainArticles';
import { IMainArticlesProps } from './components/IMainArticlesProps';
import { sp } from "@pnp/sp/presets/all";
export interface IMainArticlesWebPartProps {
list_title: string;
site_url: string;
}
export default class MainArticlesWebPart extends BaseClientSideWebPart<IMainArticlesWebPartProps> {
public render(): void {
const element: React.ReactElement<IMainArticlesProps> = React.createElement(
MainArticles,
{
list_title: this.properties.list_title,
site_url: this.properties.site_url
}
);
ReactDom.render(element, this.domElement);
}
public onInit(): Promise<void> {
sp.setup({
spfxContext: this.context
});
return super.onInit();
}
protected onDispose(): void {
ReactDom.unmountComponentAtNode(this.domElement);
}
protected get dataVersion(): Version {
return Version.parse('1.0');
}
protected getPropertyPaneConfiguration(): IPropertyPaneConfiguration {
return {
pages: [
{
header: {
description: strings.PropertyPaneDescription
},
groups: [
{
groupName: strings.BasicGroupName,
groupFields: [
PropertyPaneTextField('list_title', {
label: strings.ListTitleFieldLabel
}),
PropertyPaneTextField('site_url', {
label: strings.SiteURLFieldLabel
})
]
}
]
}
]
};
}
}
It shows as
I can't see what's wrong. Does anyone know?
Lösung
You need to check 2 places in your code.
your webpart ts file has a interface ending with WebPartProps
make you sure you have added properties in there as well. It should look like
export interface MainArticlesWebPartProps{
description: string;
list_title: string;
site_url: string;
}
Lizenziert unter: CC-BY-SA mit Zuschreibung
Nicht verbunden mit sharepoint.stackexchange