我想知道如何将日期值设置为 Fluent UI datepicker sharepoint spfx react答案

【问题标题】：I want to know how to set date value into a Fluent UI datepicker sharepoint spfx react我想知道如何将日期值设置为 Fluent UI datepicker sharepoint spfx react
【发布时间】：2023-03-28 20:40:01
【问题描述】：

在这里，我想从 SharePoint 列表中获取一个日期并将其设置在日期选择器中，

enter image description here

仅供参考，日期来自 API，我正在使用 pnp js 检索数据，但只有日期值未设置到日期选择器中

【问题讨论】：

标签： sharepoint spfx fluent-ui pnp-js

【解决方案1】：

@Sandesh Rathnayake，

这个控件暴露了一个属性来设置它的值：

https://developer.microsoft.com/en-us/fluentui#/controls/web/datepicker#implementation

您可以在 react 组件的状态下定义一个 Date 变量，然后将其值设置如下：

export class DatePickerBasicExample extends React.Component<any, IDatePickerBasicExampleState> { 
  constructor() { 
    super(); 

    this.state = { 
      firstDayOfWeek: DayOfWeek.Sunday, 
      value: new Date()
    }; 
  }

....

 <DatePicker 
          label='Start date' 
          isRequired={ false } 
          allowTextInput={ true } 
          ariaLabel={ desc } 
          firstDayOfWeek={ this.state.firstDayOfWeek } 
          strings={ DayPickerStrings } 
          value={ this.state.value } 
          onSelectDate={ date => this.setState({ value: date }) } 
        />

【讨论】：

这对我不起作用。使其相同，但仍显示 1970 作为默认值。
DatePicker 控件中的 "Value" 是您设置初始值的位置（也就是您从 SharePoint 获得的值）。所以将“value: new Date()”替换为“value: [来自 SharePoint 的日期对象]”