我有

var pos = ["a","b"]
pos.unshift(<span className="common">Common Word</span>)
var parts_of_speech = pos.join(', ')

渲染{pos}可以正确打印Common Word ,我可以设置css类的样式。 打印{parts_of_speech}导致[object Object]而不是Common Word被打印。

可以做些什么使它达到我的期望,或者这是执行此操作的错误方法?

#1楼 票数:0 已采纳

当您在JSX中说<span className="common">Common Word</span>时,您不是在处理span元素。 实际上,这只是一个JavaScript函数调用:

React.createElement(
  "span",
  { className: "common" },
  "Common Word"
);

您可以使用Babel获得上面的结果

因此,您将获得将函数的结果与字符串连接在一起的结果。

您的代码可通过Babel转换为以下内容:

var pos = ["a", "b"];
pos.unshift(React.createElement(
  "span",
  { className: "common" },
  "Common Word"
));
var parts_of_speech = pos.join(', ');

因此,如果React.createElement返回某个对象,则它应该具有一个输出[object Object]toString()方法。

像这个例子

"use strict";

var pos = ["a", "b"];
pos.unshift((function() { return {}; })());
var parts_of_speech = pos.join(', ');

console.log(parts_of_speech)

  ask by irregular translate from so

未解决问题?本站智能推荐:

1回复

在对象数组中的字符串中查找数值并进行计算

我的JavaScript数组如下所示。 我需要选择以下详细信息: 我尝试了以下方法来从字符串获取非数字。 但是输出是这样的。 这种方法是将逗号放在每个数字的前面,删除前面的00的小数点。我不知道如何只选择借方金额。 我期望这样的输出: myArr = [{ "id":
3回复

如何将onclick事件添加到reactjs中由dangerouslysetInnerHtml呈现的字符串?

我有一个字符串,即 我想要的是能够在<b>标签中添加一个 onclick 事件,在点击时执行状态操作。 潜在的问题是我有一个函数应该渲染 API 传递的任何内容。 API 将发送一个字符串“Money received for order ID 123 ”,或者可以是我无法控制的任何字
2回复

如何将字符串作为参数传递并将其附加到REACT状态

我想传递一个字符串作为完成this.state并构建HTML的参数。 我在render()下面和return上面创建一个箭头函数 我尝试了不同的变体,但均无效果或出现“无法读取媒体资源”
2回复

为什么join()不会从javascript中的数组中删除空字符串?

这是一个简单的reactjs项目的测试用例,在这种情况下,我尝试针对textContent进行测试。 container只是一个div元素,它是我们的渲染目标。 而Simple是返回 react 组件的函数。 textContent是字符串,但分配的内存长度和“逻辑”内存的长度不同。 所以,首先
1回复

通过带有字符串对象的数组进行映射并呈现HTML标签

我正在创建一个简单的 React 应用程序,我必须通过这样的数组进行映射: 有时在字符串内部,我有一些强大的标签要呈现。 当我尝试呈现该句子时,我会看到呈现的 html。 如果我尝试使用模板文字并将该强标记分配给变量,则会出现 [object object] 错误。 在这种情况下如何呈现标签? 尽可
2回复

当用户尝试将随机字符串附加到URL时,如何将用户重定向到“未找到页面”?

我目前正在使用 react.js 开发一个网络应用程序。 当用户尝试将随机字符串附加到 URL 时,我想将用户重定向到静态“未找到页面”。 当前代码如下: 我试图通过添加以下行将用户重定向到“未找到页面” - 但它仍然无法正常工作。
2回复

通过span标签动态包装js字符串,这可能会在React中危险地呈现

我有一个字符串,我想使用 aria-label 标签将 span 标签单独添加到字母表中。 最终结果将在 React 中危险地呈现。 请指教。 这就是我所拥有的。 const str = `D = (C - B) / B`; const addAriaLabels = (str) =>
1回复

使用来自json文件的字符串将字符串数组传递给React组件,并允许内联span标签

我正在尝试获取一个字符串数组以显示为段落,并允许在这些字符串中使用内联span标签。 我的问题是,当将值添加到段落中时,将解码“ <”和“>”标记开始,并结束其解码后的值“ <”和“>” 有没有一种简单的方法就可以在不为此情况创建特定组件的情况下使它正常工作?