我应该存储标签中使用的文本吗？答案

【问题标题】：Should I store the text used in label?我应该存储标签中使用的文本吗？
【发布时间】：2020-12-18 17:20:03
【问题描述】：

我是 Web 开发的新手，目前我正在使用 React JS 开发我的前端。

所以我有一个组件可以根据 JSON 数据动态呈现标签，

JSON 看起来像这样：

data:{
    name:"test123",
    toDoActivity:"coding",
}

这是我渲染标签的代码

Object.entries(data).map((aData)=>{
    return <div>
              <label>{aData[0]} : {aData[1]}<label>
           </div>
})

现在上面的代码将被渲染到

名称：test123

toDoActivity：编码

这里是密码箱：https://codesandbox.io/s/confident-microservice-s0sgy?file=/src/App.js

数据已正确呈现，但我想要的是使用用户友好文本呈现的数据，例如

名称：test123

待办事项：编码

我有一个想法在 JSON 中创建一个新属性“标签文本”，所以它变成这样：

data:{
    name:{value:"test123",text:"Name"},
    toDoActivity:{value:"coding",text:"To Do"},
}

但我不知道这样存储标签的文本是否是个好主意，所以我来这里寻求您的建议或更好的解决方案，提前谢谢

【问题讨论】：

标签： javascript json reactjs

【解决方案1】：

您应该使用Object.values() 函数。这是显示您想要的结果的正确方法：

import React from "react";
import "./styles.css";

const theData = {
  name: { value: "test123", text: "Name" },
  toDoActivity: { value: "coding", text: "To Do" }
};
export default function App() {
  return Object.values(theData).map((aData) => {
    return (
      <div>
        <label>
          {aData.text} : {aData.value}
        </label>
      </div>
    );
  });
}

This 是您的代码版本。

【讨论】：

啊是的，这就是我在想的，但我想知道将标签的文本存储在 json 中是否有效？因为它最终会存储在数据库中

【解决方案2】：

Object.values 和 Object.entries 在这里只是令人困惑。使用对象数组作为数据：

import React from "react";
import "./styles.css";

const theData = [
  { value: "test123", text: "Name" },
  { value: "coding", text: "To Do" }
];
export default function App() {
  return theData.map((entry) => {
    return (
      <div>
        <label>
          {entry.text} : {entry.value}
        </label>
      </div>
    );
  });
}

【讨论】：