I want to insert attachment in particular list item using pnpjs

Question

I want to update the list item with attachment but not sure why its failing the payload while saving it.

try {
 sp.web.lists.getByTitle(listName).items.select(item.Title).add((r => {
 // this will add an attachment to the item we just created to push t sharepoint list
 r.item.attachmentFiles.add(this.state.UploadedFilesArray.name, this.state.UploadedFilesArray).then(result=>{
console.log(result);
    });
 }));
} catch(e){
console.log(e);
 }

Answer 1

There is an error in this code:

...items.select(item.Title)...

Correct way:

...items.select("Title")...

You don't even need .select("Title") part. You are creating list item. thereis no point in selecting columns here. keep it simple like so:

sp.web.lists.getByTitle("CustomList").items...

I don't think this syntax is correct. It's unclear what you are doing here:

.add((r => {..)

items.add method adds list item. this is the right syntax:

.items.add({Title: 'New List item'})

Then, to add an attachment you can do it like so:

  let newListItem = await sp.web.lists.getByTitle("CustomList").items.add({Title: 'new Item'});
  await newListItem.item.attachmentFiles.add("file.txt","Some content");

Or, if you can't use async/awayt, do it like so:

  sp.web.lists.getByTitle("CustomList").items.add({ Title: 'new Item 2' }).then(newListItem => {
    newListItem.item.attachmentFiles.add("file.txt", "Some content");
  })

Update

If you want to select an existing list item by id:

let item = sp.web.lists.getByTitle("CustomList").items.getById(1);
item.attachmentFiles.add("file.txt", "Some content");

If you need to get list items by Title and add attachments to these items:

let item = sp.web.lists.getByTitle("CustomList").items.filter("Title eq 5").getAll().then(items => {
    for (var i = 0; i < items.length; i++) {

      let currentItem = sp.web.lists.getByTitle("CustomList").items.getById(items[i].Id);
      currentItem.attachmentFiles.add("file 2.txt", "Some content 2");
    }
  })

I was using SP Editor Chrome extension for debugging this script:

Answer 2

You could add attachment to a list item through below PowerShell.

#Set Variables
$SiteURL = "https://crescent.sharepoint.com/sites/Marketing"
$ListName = "Projects"
$ItemID ="2"
$FilePath ="C:\Docs\UserInfo.csv"
#Connect to PNP Online
Connect-PnPOnline -Url $SiteURL -Credentials (Get-Credential)
#Get the List Item
$Item  = Get-PnPListItem -List $ListName -Id $ItemID
#Get the File and Add to List Item Attachment
$FileStream = New-Object IO.FileStream($FilePath,[System.IO.FileMode]::Open)
$AttachmentInfo = New-Object -TypeName 
Microsoft.SharePoint.Client.AttachmentCreationInformation
$AttachmentInfo.FileName =  Split-Path $FilePath -Leaf
$AttachmentInfo.ContentStream = $FileStream
$AttchedFile = $Item.AttachmentFiles.Add($AttachmentInfo)
Invoke-PnPQuery
$FileStream.Close()

Reference:Add Attachment to List Item using PowerShell