Route.push를 통해 구성요소 간에 데이터를 전달할 때 Route.params가 정의되지 않습니다.
<p><em>Homepage.vue</em>에서 <em>clickthru.vue</em>로 데이터를 전달하고 싶습니다. </p>
<p>테이블(Homepage.vue)에서 레코드를 클릭하세요.
새 구성요소(clickthru.vue)로 라우팅하고 싶습니다.
목표는 두 가지 다른 방식으로 두 가지 유형의 데이터를 전달하는 것입니다. </p>
<p><strong>첫 번째: </strong>이와 같이 <em>cve_id</em>를 Route.query로 전달하고 싶습니다</p>
<pre class="brush:php;toolbar:false;">/clickthru?cve_id=CVE-xxxx-xxxx</pre>
<p><strong>두 번째: </strong> 또한 clickthru.vue의 HTML 템플릿에 렌더링/설치하기 위해 개체를 매개변수로 전달하고 싶습니다.该对象看起来image这样：</p>
<pre class="brush:php;toolbar:false;">{ "cve": "CVE-2022-45869", "심각도": "중간", "패키지": [ { " ;패키지": "커널", "버전": "5.15.80.1", "소유자": "joslobo", "Detection_date": "12-03-2022", "BranchStatus" : { "1.0": { "sourceBranch": "NULL", "status": "NULL", "DetectedOn": "NULL", "patchedOn": "NULL", " ;firstPatchedPackageRelease": "NULL", "fixReleaseDate": "NULL", "aid": "NULL", "qid": [ "NULL" ] }, "2.0": { "sourceBranch": "2.0", "status": "패치되지 않음", "DetectedOn": "12-03-2022", "patchedOn": "NULL", "firstPatchedPackageRelease": "NULL", "fixReleaseDate": "NULL", "aid": "11574", "qid": [ "할당되지 않음" ] } } }, { "패키지": "커널", "버전": "5.10.155.1", "소유자": "joslobo", "감지_날짜": "12-03- 2022", "BranchStatus": { "1.0": { "sourceBranch": "1.0", "status": "패치되지 않음", "DetectedOn": "2022-03-12" , "patchedOn": "NULL", "firstPatchedPackageRelease": "NULL", "fixReleaseDate": "NULL", "aid": "11573", "qid": [ "Not 할당됨' ] }, "2.0": { "sourceBranch": "NULL", "status": "NULL", "DetectedOn": "NULL", "patchedOn": "NULL", "firstPatchedPackageRelease": "NULL", "fixReleaseDate": "NULL", "aid": "NULL", "qid": [ "NULL" ] } } } ] }</pre>
<p>나의<em>homepage.vue</em>中，我迭代记录/对象并以表格格式显示，如下所示：
<strong>Homepage.vue</strong></p>
<pre class="brush:php;toolbar:false;"><tbody>
<template v-for="(cve) in backend_res">
<Object.keys(cve.packages)의 템플릿 v-for="(pack_key, index)">
<tr>
<td>
<span v-if="index == 0" @click.prevent="onAboutClick(cve.cve, cve.packages)">
{{cve.cve}}
</스팬>
</td>
</tr>
</템플릿>
</템플릿>
</tbody></pre>
<pre class="brush:php;toolbar:false;">메서드: {
onAboutClick(cve_id, cve_obj) {
console.log('----> cve_id = ', cve_id)
console.log('----> cve_obj = ', cve_obj) // 이 시점에서 cve_obj가 성공적으로 인쇄되었습니다.
this.$router.push(
{
이름: '클릭스루',
쿼리: {'cve_id': cve_id},
매개변수: {'cve_obj': cve_obj}
})}</pre>
<p><strong>clickthru.vue</strong></p>
<pre class="brush:php;toolbar:false;"><script>
기본값 내보내기 {
소품: ['cve_id', 'cve_obj'],
데이터() {
반품 {
cve_id: this.$route.query.cve_id,
cve_obj: this.$route.params.cve_obj, // cve_obj는 정의되지 않았습니다.
};
},</pre>
<p><strong>main.js</strong></p>
<pre class="brush:php;toolbar:false;">const 경로 = [
{
경로: '/클릭스루',
이름: '클릭스루',
구성요소: 클릭연결,
소품: 사실
}
]</pre>
<p>如下所示，当<em>$route</em>被记录时，查询被成功识别，但是，params为空。</p>
<pre class="brush:php;toolbar:false;">{ "fullPath": "/clickthru?cve_id=CVE-2022-45869", "hash": "", "query" ;: { "cve_id": "CVE-2022-45869" }, "name": "clickthru", "path": "/clickthru", "params": {}, "matched": [ { "path": "/clickthru", " ;name": "clickthru", "meta": {}, "props": { "default": false }, "children": [], "instances": { "default": null }, "leaveGuards": { "Set(0)": [] }, "updateGuards": { "Set(0)": [] }, "enterCallbacks": {}, " ;컴포넌트": { "기본값": { "속성": [ "cve_id", "cve_obj" ], "__hmrId": "91ec59e3", "__file": "E:/ASTROLABE_FE/CBL-Mariner-CVE-Website/src/comComponents/clickthru.vue" } } } ], "meta": {}, "href": "/clickthru?cve_id=CVE-2022-45869" }</pre>
<p>我希望能够传递 cve_obj 而不是 url/path 적일부분분
任何关于如何通过参数, 元或任何其他方式做到这一点的提示都值得赞赏</p>
