Question

我正在尝试通过使用pageContext从当前页面获取值，但是却得到了undefined或404。这种情况：在“站点页面”库中，有几个新闻页面。每个新闻页面都有一些附加的标签。此标记位于“网站页面”库中的自定义列中。有具有1个标签和其他几个标签的新闻。可能是两个或更多新闻共享相同标签的情况。目的是当我打开新闻页面时，附加到该新闻的标签也可见。

直到现在，我一直使用@ pnp / pnpjs，代码看起来像这样：

var result: any = await sp.web.lists.getByTitle("Site Pages")
  .items.getById(15)
  .select("Tags")
  .get();

return await result.Tags;

它给了我404错误

我也尝试过这个：

this.context.pageContext.list('Site Pages').listItem['Tags'].get().then((items: any[]) => {
  console.log(items);
});

但是它使我无法读取未定义的属性“列表”

您知道如何获取与当前新闻相关的“标签”列的值吗？

这是更新 现在我得到正确的标签。现在的问题是如何在屏幕上显示它？

import * as React from 'react';
import styles from './ReadTags.module.scss';
import { IReadTagsProps } from './IReadTagsProps';
import { sp } from '@pnp/pnpjs';

export default class ReadTags extends React.Component<IReadTagsProps, {}> {
  constructor(props: IReadTagsProps) {
    super(props);

  }

  private async getTags() {
      var id = this.props.context.pageContext.listItem.id;
      var result: any = await sp.web.lists.getByTitle("Site Pages")
        .items.getById(id)
        .select("Tags")
        .get();

      return await result.Tags;
  }

  public render(): React.ReactElement<IReadTagsProps> {
    console.log(this.getTags());
    return (
      <div className={ styles.readTags }>
        <div className={ styles.container }>
          <div className={ styles.row }>
            <div className={ styles.column }>
            </div>
          </div>
        </div>
      </div>
    );
  }
}

问候阿美科

Answer 1

您可能想要做的是将标记存储在组件的状态下。然后，您可以在渲染过程中显示这些（如果state的值不为空）。我强烈建议您阅读React教程，以了解React的生命周期和状态/属性。

https://reactjs.org/tutorial/tutorial.html

https://reactjs.org/docs/state-and-lifecycle.html

将数据保存在componentDidMount中，通过使用this.setState将数据存储在状态中，然后使用this.state.tags在渲染中运行它们。而不是SPFx问题，更多的是React问题：）

这里有大量带有SPFx和React的样本：

https://github.com/SharePoint/sp-dev-fx-webparts/tree/master/samples

如何在SPFx中使用pageContext？

1 个答案: