从 JSON 响应中的键名中删除句点

remove period from key name in JSON response

所以,我不确定这里发生了什么,也不确定为什么要在 JSON 键名中加上句点。

我想做的事情的概述是通过 ejs 变量将 json 响应传递到页面模板中,并从各个字段中获取数据。

json 响应如下所示:

来自 prismic.io。 (打开对象括号在那里被切断,数据是主要对象的子对象)。

当我通过 EJS 注入时

<%= product.data.product.imgone2.value.main.url %>

我收到如下错误:

 Cannot read property 'imgone2' of undefined

哪个,prismic为什么要这么做?

有没有办法用 EJS 解决这个问题?

如果不是,我如何使用 javascript 函数解析 JSON 响应以将其删除?

如果您需要我的路线:

router.get('/product/:slug', function(req, res) {
//route params
  var slug = req.params.slug;
  var productResp; //scope up api response to pass to render()
  console.log(slug);
//api call
  Prismic.api("https://prismic.io/api").then(function(api) {
    return api.getByUID('product' , slug);
  }).then(function(response) {

    res.render('product-template', {
      product: response,
    })

  }, function(err) {
    console.log("Something went wrong: ", err);
  });
});

谢谢!

have you tried product.data["product.imgone2"].value.main.url?

来自官方文档

访问属性喜欢object.property

property must be a valid JavaScript identifier, i.e. a sequence of alphanumerical characters, also including the underscore ("_") and dollar sign ("$"), that cannot start with a number. For example, object. is valid, while object.1 is not.

如果 属性 不是有效的 JavaScript 标识符,您必须使用括号表示法。

https://developer.mozilla.org/de/docs/Web/JavaScript/Reference/Operators/Property_Accessors

前面已经提到了,使用括号表示法:

product.data["product.imgone2"].value.main.url

如果由于某种原因无法做到这一点,您可以通过以下函数 运行 您的对象 "fix" 结构:

//this will transform structures like these:
var a = {
  "data": {
    "product.imgone2": {
      "value": {
        "main.url": "yourMainUrl"
      },
      "another.value": "to show how this is handled"
    }
  }
}

//into these:
var b = nestKeysWithDots(a);
console.log(JSON.stringify(b, null, 2));

//wich now can be resolved by your paths, without worrying
console.log(
  "b.data.product.imgone2.value.main.url", 
  b.data.product.imgone2.value.main.url
);


//and the implementation:
function isObject(value){
  return typeof value === "object" && value !== null;
}

function nestKeysWithDots(source){
  return !isObject(source)? source:
    Array.isArray(source)? source.map(nestKeysWithDots):
    Object.keys(source).reduce((target, path) => {
      var value = nestKeysWithDots(source[path]);
      path.split(".").reduce((obj, key, index, array) => {
        if(index+1 === array.length){
          //last key
          obj[key] = value;
          return;
        }
        return key in obj && isObject(obj[key])?
          obj[key]:
          (obj[key] = {});
      }, target);
      return target;
    }, {});
}