javascript - 关于改写json，并保存

问题描述

一段json数据展示在页面上，如何双击input框修改value值并保存下来

{ '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': ''} ] } ]}

问题解答

思路大概是先把.json字符串通过.json()转成js对象..然后把value的值与对应input绑定, 如果用mvvm的框架的话会简单很多, 纯js也可以写一个双向绑定. 又或者使用现成的json编辑库, 这个推荐一个jsoneditorhttps://github.com/josdejong/jsoneditor/