做调查的网站有哪些,wordpress+简书模板,阿里云域名注册好了怎么做网站,什么是搜索引擎推广这个写是不是很新颖#xff0c;传父组件传值#xff01;这是什么鬼。。。
假设你有以下逻辑业务。在A页面弹出一个组件B#xff0c;A组件里面使用B组件#xff0c;是否展示B组件你使用的是baselineShow变量控制#xff01;
BaselineData :isVisible.syncbasel…这个写是不是很新颖传父组件传值这是什么鬼。。。
假设你有以下逻辑业务。在A页面弹出一个组件BA组件里面使用B组件是否展示B组件你使用的是baselineShow变量控制
BaselineData :isVisible.syncbaselineShow addNewCrfActionaddNewCrfAction/
而B组件里面是你封装的el-dialog!如下B组件内的代码为
templateel-dialog title选择CRF :visible.syncisVisible width850pxappend-to-body:close-on-click-modalcloseOnClickModal:show-closeshowClose:before-closehandleClosediv classmt-20 flex wrap main-box v-loadingapiLoading
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX/divspan slotfooter classdialog-footerel-link typeprimary classmr-15 clickcheckedClear清空/el-linkel-button typeprimary clicksubmit确定/el-buttonel-button typeplain clickcancel取消/el-button/span/el-dialog
/templatescript
import crudCrfs from /api/crf/template
export default {props: {isVisible: {type: Boolean,default:false},closeOnClickModal: {type: Boolean,default:true},showClose: {type: Boolean,default:true},showAddOption: {type: Boolean,default:true},},data() {return {list: [],apiLoading:true}},created(){crudCrfs.getAllCrfs().then(res{res.forEach(e{e.selected falsee.subTitle 包含 e.groupCount 个题组, e.componentCount 字段this.list.addObject(e)})this.apiLoading false})},methods: {handleClose() {this.$emit(update:isVisible, false);},checkedItems(i, num) {i.selected !i.selected},checkedClear() {this.list.filter(ee.selected).forEach(element {element.selected false});},submit() {let activeList []this.list.filter(ee.selected).forEach((element,index) {// activeList.addObject(index)activeList.addObject(element)});this.$emit(baselineSubmit, activeList)this.$emit(update:isVisible, false);this.dataBlock.callLogicDataBlock(addedBaselineSuccess, { state: success })},addNewCrfAction(){this.$emit(update:isVisible, false);this.$emit(addNewCrfAction,{})},cancel(){this.$emit(update:isVisible, false);this.$emit(cancelAction,{})}}
}
/scriptstyle.addCrf {height: 60px;width: 200px;line-height: 60px;border: 1px dashed lightgray;background-color: rgb(245, 245, 245);}.items-w {width: 244px;}.main-box {max-height: 300px;overflow-y: auto;}.items-check {right: 10px;top: 25px;}
/style在A页面弹出B组件 此时当你在B组件内部关闭弹窗时你就不得不在A组件里面同步更新A组件里面的变量baselineShow否则下次无法弹出此页面。那如何在B组件内部同步修改A组件内的值呢 核心代码告诉B组件哪个变量要进行同步修改进行如下标记;
:isVisible.syncbaselineShow
切换A里面使用的时候不能这样使用 v-ifbaselineShow如果这样使用则达不到预期的效果
BaselineData v-ifbaselineShow :isVisible.syncbaselineShow addNewCrfActionaddNewCrfAction/ 在B组件内部关闭弹窗时调用则不必再去手动维护A组件内部的变量baselineShow
this.$emit(update:isVisible, false);
同样B组件内部的props定义也要注意 props: {isVisible: {type: Boolean,default:false},
}
