javascript - À propos de la réécriture de JSON et de son enregistrement

Question

Une donnée json est affichée sur la page, comment double-cliquer sur la zone de saisie pour modifier la valeur et l'enregistrer

{
  "OpcUaClientConfig": {
    "endpointUrl": "opc.tcp://127.0.0.1:26545",
    "userName": "user1",
    "password": "password1",
    "securityMode": "NONE",
    "securityPolicy": "None",
    "timeout": 6000
  },
  "RedisConfig": {
    "Host": "127.0.0.1",
    "Port": 6379,
    "Password": "AUlSBQqy"
  },
  "MqttConfig": {
    "Protocol": "mqtt",
    "Host": "120.76.194.101",
    "Port": 1883,
    "UserName": "admin",
    "Password": "admin1702"
  },
  "Equiment": [
    {
      "Device": "Device1",
      "Group": "NC01",
      "DeviceID": "1",
      "Count": 0,
      "DeviceCode": "000100001000001",
      "Tags": [
        {
          "TagName": "progf",
          "Address": "ns=1;s=progf1",
          "ClientAccess": "RO",
          "ScanRate": "1000",
          "DataType": "",
          "Value": "",
          "Status": "",
          "Timestamp": ""
        },
        {
          "TagName": "ms",
          "Address": "ns=1;s=ms1",
          "ClientAccess": "RO",
          "ScanRate": "1000",
          "DataType": "",
          "Value": "",
          "Status": "",
          "Timestamp": ""
        }
      ]
    },
    {
      "Device": "Device1",
      "Group": "NC09",
      "DeviceID": "3",
      "Count": 0,
      "DeviceCode": "000100001000003",
      "Tags": [
        {
          "TagName": "progf",
          "Address": "ns=1;s=progf2",
          "ClientAccess": "RO",
          "ScanRate": "1000",
          "DataType": "",
          "Value": "",
          "Status": "",
          "Timestamp": ""
        },
        {
          "TagName": "ms",
          "Address": "ns=1;s=ms2",
          "ClientAccess": "RO",
          "ScanRate": "1000",
          "DataType": "",
          "Value": "",
          "Status": "",
          "Timestamp": ""
        }
      ]
    }
  ]
}

Answer 1

L'idée est d'abord .json字符串通过.json()转成js对象...puis de lier la valeur de la valeur à l'entrée correspondante. Ce sera beaucoup plus simple si vous utilisez le framework mvvm. Vous pouvez également écrire une liaison bidirectionnelle en pur js. peut utiliser une bibliothèque d'édition json prête à l'emploi, ceci recommande un éditeur json https://github.com/josdejong/jsoneditor/