Question

对于糟糕的标题抱歉，我不确定如何描述我正在做的事情，我的代码就是这样：

        if (is_title === 'false') {
            $elem.popover({
                placement: 'auto',
                trigger: 'hover',
                html: true,
                delay: {"show": 0, "hide": 100},
                container: $elem,
                animation: true,
                template: '<div class="popover main_block popover_tweaks" style="width: 500px;" role="tooltip"><div class="arrow"></div><div class="popover-content"></div></div>'
            });
        } else {
            $elem.popover({
                placement: 'auto',
                trigger: 'hover',
                html: true,
                delay: {"show": 0, "hide": 100},
                container: $elem,
                animation: true,
                template: '<div class="popover main_block popover_tweaks" style="width: 500px;" role="tooltip"><div class="arrow"></div><div class="block_header"><h2 class="popover-title"></h2></div><div class="popover-content"></div></div>'
            });

        }

我是一个（想要的）php dev，所以我尝试了这个（认为它像数组一样工作，我会添加最后一个参数，但不会去）

        $elem.popover({
                placement: 'auto',
                trigger: 'hover',
                html: true,
                delay: {"show": 0, "hide": 100},
                container: $elem,
                animation: true,
            });
        if (is_title === 'false') {
            $elem.popover({

                template: '<div class="popover main_block popover_tweaks" style="width: 500px;" role="tooltip"><div class="arrow"></div><div class="popover-content"></div></div>'
            });
        } else {
            $elem.popover({

                template: '<div class="popover main_block popover_tweaks" style="width: 500px;" role="tooltip"><div class="arrow"></div><div class="block_header"><h2 class="popover-title"></h2></div><div class="popover-content"></div></div>'
            });

        }

我的问题是，有没有办法只更改模板参数而不重复if else中的所有其他参数？

Answer 1

您正在传递对象文字。您可以先使用公共部件对其进行初始化，然后根据逻辑添加特定部件。

例如：

var param = {
            placement: 'auto',
            trigger: 'hover',
            html: true,
            delay: {"show": 0, "hide": 100},
            container: $elem,
            animation: true,
        }

if (is_title === 'false') {
    param.template = '<div class="popover main_block popover_tweaks" style="width: 500px;" role="tooltip"><div class="arrow"></div><div class="popover-content"></div></div>';
} else {
    param.template =  '<div class="popover main_block popover_tweaks" style="width: 500px;" role="tooltip"><div class="arrow"></div><div class="block_header"><h2 class="popover-title"></h2></div><div class="popover-content"></div></div>';
}
$elem.popover(param);

或者，您可以在对象文字中使用条件，因此您可以执行以下操作：

$elem.popover({
    placement: 'auto',
    trigger: 'hover',
    html: true,
    delay: {"show": 0, "hide": 100},
    container: $elem,
    animation: true,
    template: is_title ? 
        '<div class="popover main_block popover_tweaks" style="width: 500px;" role="tooltip"><div class="arrow"></div><div class="block_header"><h2 class="popover-title"></h2></div><div class="popover-content"></div></div>' 
        :'<div class="popover main_block popover_tweaks" style="width: 500px;" role="tooltip"><div class="arrow"></div><div class="popover-content"></div></div>'
        });

Answer 2

只需使用条件运算符：

        $elem.popover({
            placement: 'auto',
            trigger: 'hover',
            html: true,
            delay: {"show": 0, "hide": 100},
            container: $elem,
            animation: true,
            template: (is_title === 'false' ? '<div class="popover main_block popover_tweaks" style="width: 500px;" role="tooltip"><div class="arrow"></div><div class="popover-content"></div></div>' : '<div class="popover main_block popover_tweaks" style="width: 500px;" role="tooltip"><div class="arrow"></div><div class="block_header"><h2 class="popover-title"></h2></div><div class="popover-content"></div></div>')
        });

Answer 3

您可以先创建一个选项对象，然后使用三元运算符作为模板。类似的东西：

`var opts = {template: title === false ? '<div>template 1</div>' : '<div>template 2</div>'};`

然后致电

popover(opts)

格式化道歉！

传递两个不同参数的较短方式

3 个答案: