SPFX for showing list items as News items

john john 946 Reputation points
2021-11-25T20:46:39.033+00:00

I have a custom list as follow:-

152656-lsit.png

where i add links to pages + categorize them using a field named "Featured". now i want to show the above 3 list items as follow in a web part which looks similar to the News web part:-

152579-f1.png

So it should show the list item which has its Featured = "Featured New" on one column and the other 2 list items on another column...

now i created a new SPFx web part code for the 2 files as attached.

but this what i get on the above list (i added the same background image for testing purposes only):-

152580-4itmes.png

so not sure why 2 list items will be duplicated + the Featured News will not be shown... any advice how i can modify my code to show the Featured News list item on one column + the other 2 lists items on another column, as shown in the first picture? Thanks

152713-code.pdf

152610-code.pdf

SharePoint
SharePoint
A group of Microsoft Products and technologies used for sharing and managing content, knowledge, and applications.
9,737 questions
SharePoint Development
SharePoint Development
SharePoint: A group of Microsoft Products and technologies used for sharing and managing content, knowledge, and applications.Development: The process of researching, productizing, and refining new or existing technologies.
2,686 questions
0 comments

1 answer

Sort by: Most helpful
Most helpful Newest Oldest
  1. RaytheonXie_MSFT 31,681 Reputation points Microsoft Vendor
    2021-11-26T07:57:44.483+00:00

    Hi @john john ,
    I will recommend you News web part to list news items in sharepoint online. When you are working with a News web part, you can specify the source for your news posts. Your news posts can come from the site you are on while using the web part (This site), a hub site that the current site is part of (All sites in the hub), or one or more individual sites (Select sites). Another option is to choose Recommended for current user, which will display posts for the current user from people the user works with; managers in the chain of people the user works with, mapped against the user's own chain of management and connections; the user's top 20 followed sites; and the user's frequently visited sites.
    Please refer to following document
    https://support.microsoft.com/en-us/office/use-the-news-web-part-on-a-sharepoint-page-c2dcee50-f5d7-434b-8cb9-a7feefd9f165

    If the answer is helpful, please click "Accept Answer" and kindly upvote it. If you have extra questions about this answer, please click "Comment".
    Note: Please follow the steps in our documentation to enable e-mail notifications if you want to receive the related email notification for this thread.

    1 person found this answer helpful.