[英]JavaScript problem converting strings inside object (inside loop)
While building a carousel module for Joomla I am having 2 JavaScript issues I can't get fixed.在为 Joomla 构建轮播模块时,我遇到了 2 个 JavaScript 问题,我无法修复。 I've been trying for 2 days.
我已经尝试了2天。 Hopefully someone here can point out what I am doing wrong.
希望这里有人能指出我做错了什么。
"0"
or string "1"
And I can't"0"
或字符串"1"
中得到 boolean而且我不能JSON.parse()
to convert an object string to a JavaScript objectJSON.parse()
将 object 字符串转换为 JavaScript ZA8CFDE6331149EB2ACZC96B8 The situation:情况:
To be able to have multiple instances on 1 page I am passing each modules individual settings (via php) to 1 object in my javascript file.为了能够在 1 页上有多个实例,我将每个模块的单独设置(通过 php)传递给我的 javascript 文件中的 1 object。 Each module is 1 key value pair inside the object, the value being its own settings object.
每个模块是 object 内部的 1 个键值对,值是它自己的设置 object。 Basicly, this is how the JS recieves it:
基本上,这是 JS 接收它的方式:
const moduleSettings = {
"103":{"items":3,"margin":5,"loop":"1","center":"0","responsive":"{0:{items:1}}"},
"105":{"items":3,"margin":5,"loop":"0","center":"1","responsive":"{0:{items:2}}"}
};
Next I need to loop over each module to initialize the settings.接下来我需要遍历每个模块来初始化设置。 This is done on ready using jQuery.
这是使用 jQuery 完成的。
jQuery(document).ready(function() {
// Loop over each module
const modules = Object.keys(moduleSettings);
for (const id of modules) {
const target = "carousel-" + id;
const params = moduleSettings[id];
// Callback to evaluate true/false params
function eval(singleParam) {
return params[singleParam] === "1";
};
// Initialize carousel
jQuery(target).owlCarousel({
items: params.items,
margin: params.margin,
loop: eval("loop"),
center: eval("center"),
responsive: JSON.parse(params.responsive)
});
};
});
The carousel properties items
& margin
are numbers.轮播属性
items
和margin
是数字。 No problem there, but these are recieved as numbers from the start.那里没问题,但这些从一开始就作为数字接收。
The problem:问题:
loop
& center
should return a boolean, based on the callback function eval()
.loop
和center
应该返回一个 boolean,基于回调 function eval()
。 But they just return the string "0"
or "1"
."0"
或"1"
。responsive
should return an object. responsive
属性应返回 object。 But this still remains a string object "{...}"
."{...}"
。 The console error:控制台错误:
The first problem above does not block functionallity.上面的第一个问题不会阻止功能。 It works, but I want to understand why my values are not booleans.
它有效,但我想了解为什么我的值不是布尔值。
The second problem however causes console error and make the carousel not work.然而,第二个问题会导致控制台错误并使轮播无法正常工作。 This is only IF responsive is not an empty string.
仅当响应不是空字符串时。 When responsive is an empty string, it works.
当 responsive 是一个空字符串时,它可以工作。 But I need the responsive setting.
但我需要响应式设置。
I've been looking for the cause of this issue for 2 days now.我一直在寻找这个问题的原因 2 天了。 It's getting frustrating.
越来越令人沮丧。 Any pointers would be most helpfull.
任何指针都是最有帮助的。 Thanks!
谢谢!
instead of using eval
function use can you below而不是使用
eval
function 你可以在下面使用
jQuery(target).owlCarousel({
items: params.items,
margin: params.margin,
loop: !!params.loop,
center: !!params.center,
responsive: JSON.parse(params.responsive)
});
For the second issue, you need to change the structure from your server side code to generate this module settings JSON.对于第二个问题,您需要从服务器端代码更改结构以生成此模块设置 JSON。 The responsive object is not a proper JSON.
响应式 object 不是正确的 JSON。 its should be like
它应该像
responsive: {items:1}
or responsive: [{items:1}]
responsive: {items:1}
或responsive: [{items:1}]
If you can post that code then I can tell you the change need to made there.如果您可以发布该代码,那么我可以告诉您需要在那里进行的更改。
In the example you've provided, you're not evaluating the params field by name provided as a singleParam
argument, but the actual params.singleParam
field, which is undefined
.在您提供的示例中,您不是按作为
singleParam
参数提供的名称评估 params 字段,而是实际的params.singleParam
字段,它是undefined
。 To fetch field by it's name use brackets syntax: params[singleParam]
.要按名称获取字段,请使用括号语法:
params[singleParam]
。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.