javascript - Ractive.js带有破折号的变量

后端（WordPress）生成JSON输出：

sizes: {
thumbnail: "150x150.jpg",
thumbnail-width: 150,
thumbnail-height: 150,
}

在JS中，我可以使用带有破折号的变量：sizes['thumbnail-height']。不幸的是，在Ractive.js中，模板{{sizes['thumbnail-height']}}不起作用。我该如何处理这个问题？

最佳答案

您可以将对象键写为字符串，然后可以使用-符号。那是避免它并使用camelCase样式的一个好习惯。如果您认识到css属性，总是将其转换为驼峰式大小写。

sizes: {
    'thumbnail': "150x150.jpg",
    'thumbnail-width': 150,
    'thumbnail-height': 150,
}
// Best
    sizes: {
        thumbnail: "150x150.jpg",
        thumbnailWidth: 150,
        thumbnailHeight: 150,
    }

第一种情况仍然可以使用带引号的属性名称（例如{{sizes['thumbnail-height']}}）与Ractive（请参见http://jsfiddle.net/6hd3xt6t/）一起使用

关于javascript - Ractive.js带有破折号的变量，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/29368961/