有一个错误，TypeError:无法使用react xml-解析器读取未定义的属性(读取“替换”)。

Question

我正在尝试将XML文件提取到我的react组件中，但是由于以下错误而无法获取，我很长一段时间都在使用它，请帮助我解决这个问题。

链接到XML：https://7targets.ai/blog/feed.xml

这是我的组件，名为BlogFeed.js。

import React, { useEffect, useState, Component } from "react";
import axios from "axios";
import ReactDOM from "react-dom";
import XMLParser from 'react-xml-parser';
import { parse } from 'fast-xml-parser';
// import "react-responsive-carousel/lib/styles/carousel.min.css"; // requires a loader
// import { Carousel } from "react-responsive-carousel";
import "./sample.scss";

const BlogFeed = () => {
  const [data , setData] = useState();
  useEffect(() => {
    axios
      .get("https://7targets.ai/blog/feed.xml", {
        "Content-Type": "application/xml; charset=utf-8",
      })
      .then((response) => {
        setData(response.data)
        var xml = new XMLParser().parseFromString(data);    // Assume xmlText contains the example XML
        console.log(xml);
      }).catch((error)=>{
        console.log("There is an error , ",error)
      });
  }, []);

  console.log(data);
  return (
    <>
      
    </>
  );
};

export default BlogFeed;

它在我使用XMLparser时抛出了一个错误，它说：

There is an error ,  TypeError: Cannot read properties of undefined (reading 'replace')
    at e.value (bundle.js:1:1)
    at e.value (bundle.js:1:1)
    at BlogFeed.js:19:1

请帮我渡过难关。

Answer 1

setData是异步函数，所以当您将data传递给xml解析器时，它仍然是undefined。只需将axios响应数据直接传递给xml解析器即可。

setData(response.data)
var xml = new XMLParser().parseFromString(response.data);