Vue.js Sweet Alert 2

时间:2017-07-03 08:59:23

标签: javascript dynamic vue.js sweetalert sweetalert2

new Vue({

    el: '#app',

    data(){

        results: []        
    }   
});

我尝试使用Sweet Alert显示提醒,并在顶部输入搜索过滤器,然后我想根据输入的内容过滤results在警报中。

问题是,Vue指令似乎不会在Sweet Alert中生效 - 可能是因为它不在#app的范围内。令我惊讶的是,我没有看到太多问题,所以我认为我只是做错了。

有没有办法在Sweet Alert的标记中加入Vue指令,事件等?

swal({

    title: 'Something',
    html: `
            <button @click="test">Press Me</button>
          `
});

由于

1 个答案:

答案 0 :(得分:0)

在单变量的情况下,注意它的反引号而不是单个qoute

const markup = `
 <div class="person">
    <h2>
        ${person.name}
    </h2>
    <p class="location">${person.location}</p>
    <p class="bio">${person.bio}</p>
 </div>
`;

这是for循环

const markup = `
<ul class="dogs">
    ${dogs.map(dog => `<li>${dog.name} is ${dog.age * 7}</li>`)}
</ul>
`;

参考:http://wesbos.com/template-strings-html/