我有一个插件,其中包含
等选项$.growl.default_options = {
allow_dismiss: true,
position: {
from: "top",
align: "right"
},
offset: 20,
spacing: 10,
z_index: 1031,
fade_in: 400,
delay: 5000,
template: {
icon_type: 'class',
container: '<div class="col-xs-10 col-sm-10 col-md-3 alert">',
dismiss: '<button type="button" class="close" data-dismiss="alert" aria-hidden="true">×</button>',
title: '<strong>',
title_divider: '',
message: ''
}
});
当我使用以下选项调用程序时
$.growl("I am a Message!", {
position: {
align: 'left'
},
template: {
container: '<div class="col-xs-10 col-sm-10 col-md-3 alert">'
}
});
在插件中,我执行以下操作
options = $.extend({}, $.growl.default_options, options);
而不是options
$.growl.default_options = {
allow_dismiss: true,
position: {
align: "right"
},
offset: 20,
spacing: 10,
z_index: 1031,
fade_in: 400,
delay: 5000,
template: {
container: '<div class="col-xs-10 col-sm-10 col-md-3 alert">'
}
});
为什么template
只有一个变量?
答案 0 :(得分:5)
你想要一个深度(递归)扩展:
options = $.extend(true, {}, $.growl.default_options, options);
默认情况下,$ .extend()执行的合并不是递归的。如果一个 第一个对象的属性本身就是一个对象或数组,它将是 被第二个中具有相同键的属性完全覆盖 或后续的对象。值未合并。这可以在 以下示例通过检查香蕉的值。但是,通过 对于第一个函数参数传递true,对象将是 递归合并。