ThinkSSL🔒 一键申购 5分钟快速签发 30天无理由退款 购买更放心 广告
## Rap.showPopup 支持通过方法弹框,这样可以组件化写弹出框,并且可以按需加载, Rap 会在弹框显示时将组件动态插入,弹框关闭时动态删除组件 使用 ~~~ Rap.showPopup('/category_add', { //下面的配置会覆盖 dialog 里的配置 data:{ record:_.extend({},record) }, methods: { onSave: function (data) { me.catStore.load(1); } } }); ~~~ ### category_add组件 ~~~ this.$close() 可以关闭弹出框 ~~~ 下面的例子用了 element UI 开源库 对于其他 UI 库使用也是类似的 ~~~ <style> </style> <template> <el-dialog class="cat_add" :title="record.id?'编辑分类':'添加分类'" :visible.sync="show" width="500px" > <el-form label-width="80px" label-position="left"> <el-form-item label="名称"> <el-input v-model="record.name" placeholder="分类名称"></el-input> </el-form-item> </el-form> <span slot="footer" class="dialog-footer"> <el-button @click="show = false">取 消</el-button> <el-button type="primary" @click="save">完成</el-button> </span> </el-dialog> </template> <script> //这里定义组件 Rap.define('', [], { data: function () { return { record: {}, show: true } }, watch: { 'show': function (show) { if (!show) { this.$close(); } } }, create: function () { }, methods: { save: function () { var me = this; axios.put('//cateSave', this.record, {loading: true}).then(function (rs) { me.$close(); me.onSave(); }); //onSave会被调用方覆盖 这里写个空的表示下 }, onSave: function (record) { } } }) </script> ~~~