Reactjs 将数组从Laravel传递到React时JSON输入意外结束

我试图将一个数组从Laravel传递到我的React组件，只要数据中没有空格，该组件就可以正常工作。我有以下代码：

迁移文件：

...
$table->text('other');

控制器：

$listings = Listing::latest()->take(20)->get();
return view('listing.index', compact('listings '));

视图（其中我将数据传递给React组件）：

---

只要

other

列没有任何空格，代码就可以正常工作。例如，如果

other

等于

“testdata”

，那么它可以工作，但是如果它等于

“testdata”

，并且带有空格，那么我得到了JSON的

意外结尾，我可以看到JSON刚好在
处结束。。。“其他”：“测试
有人知道为什么会发生这种情况吗？
在将数据传递到刀片视图之前，您很可能必须使用urlencode对数据进行编码。传递Urlencode Laravel：这将把JSON文件中的空格转换为%20。
是否可以共享一些示例数据以供使用？或者可能是一个CodeSandbox示例复制了这个问题？@SiddAjmera这是示例数据，我不知道如何设置Laraven并在您提到的网站上做出反应：这是没有空格的情况：
[{“id”：1，“user_id”：1，“other”：“without space”}]
这是我在“other”值中添加空格时的情况：
[{“id”：1，“user_id”：1，“other”：“没有
Errr…如果您可以创建一个复制该问题的示例，那将非常有用。
<div data-listings={{ $listings }} id="Listings"></div>

constructor(props) {
    super(props)
    this.state = {
        listings: JSON.parse(props.listings)
    }
}