页面A点击查看按钮,获取所需参数并实现页面跳转,带参数。

 methods:{
     gotoAnxd(bzmc,ljdm){    
//bzmc:bzmc   前面的bzmc是要传的参数名,后面的bzmc是页面上获得的相应的数据。ljdm同理   
         this.$router.push({path:'/hy/lclj/anxd',query:{bzmc:bzmc,ljdm:ljdm}});           //带参数,跳转页面。
           }
       }

 

页面B,获得页面A传过来的参数,同时实现搜索方法,搜索条件就是传过来的两个参数bzmc,ljdm

mounted:function(){},
activated () {
        this.initPage();
    },
methods:{
//得到A页面传来的参数,同时将两个参数传到下拉框搜索方法中。
        initPage(){
        this.bz=this.$route.query.bzmc;
        this.fs=this.$route.query.ljdm;
        findByLjdmBzmc({bzmc:this.$route.query.bzmc,ljdm:this.$route.query.ljdm}).then((res)=>{
          this.zkxmList = res.data;
            this.visibleAdd = '';
        })
      },
//下面这个是下拉框搜索方法,B页面加载完后选择条件进行查询。
        selectLjdm(){
        findByLjdmBzmc({bzmc:this.bz,ljdm:this.fs}).then((res) =>{
            this.zkxmList = res.data;
            this.visibleAdd = '';
            console.log(this.zkxmList);
          })
        },
    }

之前我是将iniPage方法写在mounted里面,但是当我不关闭页面B,在页面A重新传参数到页面B时,页面B并没有接收到我新传过去的参数。

这里关键就是activated(){}。

activated():在vue对象存活的情况下,进入当前存在activated()函数的页面时,一进入页面就触发;可用于初始化页面数据等

 

 

Logo

技术共进,成长同行——讯飞AI开发者社区

更多推荐