Home > Software design >  Delete a specific string in a `react` array
Delete a specific string in a `react` array

Time:01-06

Hello I am importing value json .

console.log(value);
> Object Array(10)
 > 0
   imageUrl: "http://stackoverflow/images/0,"
 > 1
   imageUrl: "http://stackoverflow/images/1,"
 > 2
   imageUrl: "http://stackoverflow/images/2,"
 > 3
   imageUrl: "http://stackoverflow/images/3,"
 > 4 
   imageUrl: "http://stackoverflow/images/4,"
 > 5  
 
imageUrl:"http://stackoverflow/images/0http://stackoverflow/images/0,"

...
const Minsu = () => {
 
 return (
   <>
      <img src={value[0].imageUrl} />
   </>
 )

} 

My problem is that the image is not output properly because of this , in the imageUrl now, I want to delete only this string ','. However, I tried to delete only the ',' string using filter, but it says that filter cannot be used because imageUrl is a string.

String I want to delete ',' from a specific string, how can I do it?

And if there are http://stackoverflow/images/0http://stackoverflow/images/0 in imageUrl, I want to delete one http.

CodePudding user response:

Using replace() you can do it !

const arr = [
  { imageUrl: "http://stackoverflow/images/0," },
  { imageUrl: "http://stackoverflow/images/1," },
  { imageUrl: "http://stackoverflow/images/2," },
  { imageUrl: "http://stackoverflow/images/3," },
  { imageUrl: "http://stackoverflow/images/4," },
  { imageUrl: "stackoverflow/images/0http://stackoverflow/images/0, " },
]
function App() {
  return (
    <div>
      {arr.map(val => {
        return (
          <img src={val.imageUrl.replace(',', '').replace('stackoverflow/images/0', '')} />
        )
      })}
    </div>
  );
}

export default App;

CodePudding user response:

Try replace

const value = [{ imageUrl: 'http://stackoverflow/images/0,' }];
export default function App() {
  return (
    <div>
      <h1>Hello StackBlitz!</h1>
      <p>Start editing to see some magic happen :)</p>
      return (
      <>
        <img src={value[0].imageUrl.replace(',', '')} />
      </>
      )
    </div>
  );
}
  •  Tags:  
  • Related