Question

我正在尝试使用redux创建多语言网站，我已经按照本教程> http://www.bebetterdeveloper.com/coding/getting-started-react-redux.html进行了调整，并使其适应我的项目，但是我遇到了问题。我把我的全部内容放在json文件中。我希望将一些特殊的单词加粗。是否可以在Json内容内添加html标签？我在Google中找到了某种方法，但是它不起作用...对于任何建议，我们都会很高兴，这是我的代码：

[
    {
      "lang": "en",
      "page": {
        "menu": {
          "home": "Home",
          "brand": "Brand",
          "contact": "Contact"
        },
        "home": {
          "header": "Lorem Ipsum",
          "paragraphOne": "Neque porro quisquam est qui dolorem ipsum quia dolor sit amet, consectetur, adipisci velit...",
          "paragraphTwo": "Lorem <span className=\"bold-me\"> ipsum <\/span> dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum."
        }
      }
    }
  }
]

Answer 1

如果要解析字符串中的HTML，可以使用dangerouslySetInnerHTML。然后，您可以将let output x = [ for i in 1..x do for j in 1..i do yield (i,j) ]类的样式设置为具有更粗体的文本，或仅使用bold-me标签。

示例

const content = [
  {
    lang: "en",
    page: {
      menu: {
        home: "Home",
        brand: "Brand",
        contact: "Contact"
      },
      home: {
        header: "Lorem Ipsum",
        paragraphOne:
          "Neque porro quisquam est qui dolorem ipsum quia dolor sit amet, consectetur, adipisci velit...",
        paragraphTwo:
          "Lorem <b> ipsum </b> dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum."
      }
    }
  }
];

function App() {
  return (
    <div
      dangerouslySetInnerHTML={{ __html: content[0].page.home.paragraphTwo }}
    />
  );
}

ReactDOM.render(<App />, document.getElementById("root"));

React-将html标签放入json内容

1 个答案: