vue.js如何写confirm弹窗

Question

我实现点击提交后，弹出选择框。确定：提交，取消：不提交。现在写了个大概，但不知道如何将提交函数和提示框做连接。

弹窗代码：

<transition name="bounce">

                    <div class="kiko-confirm" v-if="visible">

                      <div class="bg"></div>

                      <div class="kiko-container" :style="{width: width}">

                        <div class="header">

                          {{title}}

                          <i @click="close" class="icon-remove icon-large kiko-close-btn" v-if="closeVisible"></i>

                        </div>

                        <div class="content">

                          <slot></slot>

                        </div>

                        <slot name="footer">

                          <div class="kiko-footer" slot="footer">

                            <a href="javscript:void(0)" class="kiko-btn make-sure" @click="confirmMakeSure">确定</a>

                            <a href="javscript:void(0)" class="kiko-btn cancel" @click="confirmVisible = false">取消</a>

                          </div>

                        </slot>

                      </div>

                    </div>

                  </transition>

提交button：

<button v-on:click="submit($event)">submit</button>

如何能一点击submit就出现上面的弹窗，再点确定就提交呢。

Answer 1

给你推荐一个vue的UI库iview你的submit要控制上边的dom显示的，真正的提交方法应该要写到弹出框的确定按钮上，取消按钮就是控制弹出框隐藏的

Answer 2

再给你推荐一个vue的UI库，element