React Native - Decode HTML Entities-CodePudding

I have a react native expo app, and trying to decode some html entities.

I'm attempting to use the html-entities package, but it doesn't seem to work because I am mapping through a state component/array to return/render my data. Example code below. The decoding is not decoding the entities. Any examples of this working in this way for any one?

The state is being set from an api call, pulling records from the database.

import { decode } from "html-entities";

function Discover = async() => {
const [freeMedia, setFreeMedia] = useState([{title:She&quot; hysterical&quot;, description: test &amp; test}]);

return(
{freeMedia && freeMedia.length > 0
              ? freeMedia.map((uploads) => {
return(
<View>
<Text>{decode(uploads.title)}></Text>
<Text>{decode(uploads.description)}></Text>
</View>
)
})
: null}
)
}

CodePudding user response：

Your properties are not strings, and you're referencing freeMedia.title (undefined) instead of uploads.title:

import { decode } from "html-entities";

function Discover = async() => {
    const [freeMedia, setFreeMedia] = useState([{ title: "She&quot hysterical&quot", description: "test &amp test" }]);

    return(
        {freeMedia && freeMedia.length > 0
            ? freeMedia.map((uploads) => {
               return(
                   <View>
                      <Text>{decode(uploads.title, { level: "html5" })}></Text>
                      <Text>{decode(uploads.description, { level: "html5" })}></Text>
                  </View>
               )
            })
            : null}
    )
}