前端开发常踩坑汇总【常更新】

一、JSON.parse()、JSON.stringify()与常见问题

1.JSON.parse()和JSON.stringify()

1. JSON.parse()作用：字符串转成JavaScript对象，常用于从服务器接收数据，接收到字符串后转成js对象；当然该字符串必须为标准json格式，否则会报错。
2. JSON.stringify()作用：JavaScript对象转成字符串常用于向服务器发送数据。

2. syntaxerror: “[object object]” is not valid json at json.parse

JSON.parse()内参数不是字符串而是JS对象。

二、Element UI Table问题

1.表格中某字段含.，例如http.url:

在 Element UI 的表格组件中，如果你希望显示http.url这个字段的数据，一般情况下，你需要确保此字段存在于数据源中，并在列定义（Column）中指定这个字段。
然而，由于.在JavaScript对象属性访问语法中有特殊含义（用于访问嵌套属性），如果你直接使用 http.url 可能会出现问题，因为它可能被解释为想要访问 http 对象的 url 属性。

以下是一个修复此问题的方案：
你可以通过使用函数形式的 formatter 或者 scopedSlot 来手动获取这个字段。具体来说：

<el-table :data="tableData">
    <el-table-column
        prop="index"
        label="Index"
        width="180">
    </el-table-column>
    <el-table-column
        label="URL"
        width="180">
        <template #cell="{ record }">
                {{ record['http.url'] }}
        </template>
    </el-table-column>
</el-table>