change the expression in lwc component while iterating

Question

We can use variables in aura components to concatenate some expression, we have to use variable name itself in lwc components, while looping how to change the lwc comp variable in js file.

I tried to access the dom using this.template.querySelector(); but this one is only giving the value if I use a rendered callback.

<template for:each={documentLinks} for:item="item">

//here I need to pass the item.ContentDocument.LatestPublishedVersionId to the end of a URL string

<img src={item.srcUrl} alt="PDF"/>

we can modify the returned data from apex but the data is proxy we cannot modify it.

Answer 1

One of the possible solutions to change the URL on the dom when it loads is to change the returned data from the server. here, In lightning web components the returned data is a proxy object, only readable. so we have to clone it(there are multiple ways to clone it), to make any changes. but here what I did.

therefore, overrides array is going to be the new data.

let overrides = [];
let newData = {
  contentDocs: data[i],
  srcUrl: '/sfc/servlet.shepherd/version/renditionDownloadrendition=thumb120by90&versionId=' + data[i]['ContentDocument']['LatestPublishedVersionId']
};
makeLoggable(newData);
overrides.push(newData);


function makeLoggable(target) {
  return new Proxy(target, {
    get(target, property) {
      return target[property];
    },
    set(target, property, value) {
      Reflect.set(target, property, value);
    },
  });
}