<div id="box"> <aaa></aaa> </div>
<template id="aaa">
<h1>模板aaa=>{{msg1}}</h1> //msg1写在这里是可以的,因为这是父组件内部
//<bbb>{{msg1}}</bbb> //这种写法是不可以的,这是在子组件内部,要在这里显示父组件的数
//据,需要用props定义属性
<bbb :m='msg1'></bbb>
</template>
var vm=new Vue({
el:"#box",
data () {
a:'aaa'
},
components:{
'aaa':{
data () {
msg1:'父组件的数据'
},
template:'#aaa',
components:{
'bbb':{
// props:['m'], //这是一种写法,props以数组的形式定义属性
props:{
'm':String //这是第二种写法,对象的形式
},
template:'<h3>这是子组件bbb--{{m}}</h3>'
}
}
},
}
})
<edit-issue :title='issueTitle' :is-show.sync='modelIssue' :model-type.sync='modeltype' :issue-datas='listdb' :user.sync='users' :projects="projectDatas" :get-datas="getCreateIssues" :localtoken="localtokenId" :user- name="userName" :token-data="tokendata"> </edit-issue>
methods:{
getCreateIssues(){ //这是es6的格式
this.$http.get(url,data).then(res=>{}) //这也是es6的格式
}
}
methods:{
okConfirm(){
issueApi.delIssue(this.delId).then(res=>{
if(res.data.code==0){
this.successPop('删除成功');
this.openConfirm=false;
this.isShow=false;
//这里就是使用的父组件的方法
this.getDatas();
//end
this.$dispatch('fetchList');
}else{
this.warningPop(res.data.message)
}
})
},
}
<div class="task-btn"> <p @click="clear()">清空</p> <p @click="confirm(modalData)">搜索</p> //modalData是需要向后台发送的数据 </div>
export default{
props:['confirm'],
data(){
return {
modalData:{ProjVerName:''}
}
}
}
<issuesearch :confirm="search" :showtotal.sync="showtotal" :is-re-get.sync="isReGet" :type="chosenType"> </issuesearc>
data(){
return {
searchData:{
ProjVerName:'',
}
}
},
methods:{
search(data){ //data就是接收子组件传递过来的数据的形参
this.searchData.ProjVerName=data.ProjVerName;
this.$http.get(url,this.searchData.ProjVerName).then(res=>{
console.log(res)
})
}
}
methods:{
save (){
this.$http.post(url,data).then(res=>{
console.log('保存成功');
this.$route.router.go({
name:'issues.issueList'
}); //保存完以后跳转到对应的路由
this.$dispatch('disSave') //这里把保存事件发送出去
})
}
}
events:{
disSave(){ //这就是接收的子组件的方法
this.getCreateIssues(); //接收完以后调用一个方法获取一遍数据,这样就实现了在子组件中点击保存后,父组件能直接获取到最新的数据
}
},
机械节能产品生产企业官网模板...
大气智能家居家具装修装饰类企业通用网站模板...
礼品公司网站模板
宽屏简约大气婚纱摄影影楼模板...
蓝白WAP手机综合医院类整站源码(独立后台)...苏ICP备2024110244号-2 苏公网安备32050702011978号 增值电信业务经营许可证编号:苏B2-20251499 | Copyright 2018 - 2025 源码网商城 (www.ymwmall.com) 版权所有