Question 259097 in Reactjs Question posted in
The new location for the React Documentation can be found here.

Reactjs – Rendder fileContent with actual data from listItems

in this render function , I retrieve the data from list in sharepoint and render the fileContent but the properties didn’t replaced from listItems

this is my code of render function that I tried :
public render(): React.ReactElement {
return (

  <div className={styles.linkItemsWithReact}>
    <ol>
      {this.state.listitems.map((listitem, listitemkey) => {
        console.log(this.state.listitems);
        return (
          <li key={listitemkey}>
            <a>{this.state.fileContent}</a>
          </li>
        );
      })}
    </ol>
  </div>
);

}
and I want to render the fileContent of a specific template and displayed the properties of this template from the actual data of listItems

Tags:

2

Answers


  1. 0

    It looks like you are iterating over the this.state.listitems yet not using them except as the key prop.

    Did you mean to render listitem.fileContent or similar in the loop?

    If you can provide more details for the whole state it would be easier to debug your question.

    Login or Signup to reply.
  2. 0

    You are not using the value provided by the map callback but instead some other state.

    The following code should work if you replace content in listitem.content with the correct attribute.

    Also the second parameter of the callback of Array.prototype.map() is the index in the array so I changed that as well.

    return (
  <div className={styles.linkItemsWithReact}>
    <ol>
      {this.state.listitems.map((listitem, index) => {
        return (
          <li key={index}>
            <a>{listitem.content}</a> // TODO: replace content with the actual attribute
          </li>
        );
      })}
    </ol>
  </div>
);
    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search