面试题1:路由传递参数(对象写法)path是否可以结合params参数一起使用?
答:路由跳转传参的时候,对象的写法可以是name,path形式,但是需要注意的是,path这种写法与params参数一起使用
this.$router.push({path:'/search',params:{keyword:this.keyword},query:{k:this.keyword.toUpperCase()}) 错误
路由传递参数的三种方式:
第一种:字符串形式
this.$router.push("/search" + this.keyword + "?k=" + this.keyword.toUpperCase());
第二种:模板字符串
this.$router.push(`/search/${this.keyword}?k=${this.keyword.toUpperCase()}`)
第三种:对象
this.$router.push({name:"search",params:{keyword:this.keyword},query:{k:this.keyword.toUpperCase()}})
面试题:2.如何指定params参数可传可不传?
答:比如:配置路由的时候占位了(params参数),但是路由调转的时候就不传递。路劲就会出现问题
hhtp://localhost:8000/#/?k=QWE
http://localhost:8000/#/search?k=QWE
如果路由要求传递params参数,但是你不传递params参数,就会发现URL有问题,如果只当params参数可以传递或者不传递,在配置路由的时候,在占位的后面加上一个问号【params可以传递或者不传递】
this.$router.push({name:"search",query:{k:this.keyword.toUpperCase()}});
面试题:3.params参数可以传递也可以不传递,但是如果传递是空串,如何解决?
答:使用undefined解决:params参数可以传递,不传递(空的字符串)
this.$router.push({name:'search',params:{keyword:' ‘ || undefined} , query:{k:this.keyword.toUpperCase()}})