import * as React from 'react';
import styles from './LinksWp.module.scss';
import { ILinksWpProps } from './ILinksWpProps';
import { escape } from '@microsoft/sp-lodash-subset';
import pnp from "sp-pnp-js";
import { ClassListItems } from './ClassListItem';
import { ISPListItem } from './IListItems';
import { sp, RenderListDataParameters, RenderListDataOptions } from '@pnp/sp';
export default class LinksWp extends React.Component<ILinksWpProps, any> {
public constructor(props:ILinksWpProps,any)
{
super(props);
this.state={
items:[]
}
}
public render(): React.ReactElement<ILinksWpProps> {
return (
<div><h1>{this.props.description}</h1>
<div>{this.state.items.map(function(item:ISPListItem){
return(
<div>
<span><a href={item.URL.Url}>{item.URL.Description}</a></span>
</div>
)
})}</div>
</div>
);
}
public componentDidMount(){
this._getListItems();
}
private _getListItems():void
{
/*
pnp.sp.web.lists.getByTitle('Quick Links').items.get()
.then
((response)=>{
let listItemCollection = response.map(item=>new ClassListItems(item));
this.setState({items: listItemCollection});
}
)*/
pnp.sp.web.lists.getByTitle('Quick Links').renderListDataAsStream({
RenderOptions: RenderListDataOptions.ListData,
ViewXml : `<View><Query><Where><Eq><FieldRef Name='Function' />
<Value Type='TaxonomyFieldTypeMulti'>Group IT</Value></Eq></Where></Query><ViewFields>
<FieldRef Name='URLwMenu2' /><FieldRef Name='Region' />
<FieldRef Name='Function' /><FieldRef Name='Geography' />
</ViewFields><QueryOptions />
</View>`
}).then
((response)=>{
console.log(response)
let**let listItemCollection = response.map(item=>new ClassListItems(item));;** // this is where I get the error
this.setState({items: listItemCollection});
}
)
}
}
