두 REST 리소스의 결과를 vue-다중 선택 항목으로 그룹화된 항목과 결합

두 REST 리소스의 결과를 vue-다중 선택 항목으로 그룹화된 항목과 결합

나는 javascript/vuejs의 신인이고, 나는 두 개의 카테고리 그룹을 가지고 싶은 vue-다중 선택권을 구현했다. 하나는 github의 프로젝트이고, 두번째는 제3자 프로젝트다.

두 사람 모두에게 나는 아래에 코드를 썼다.둘 중 한 명이라도 이렇게 하면 효과가 있어this.projects = _projects또는this.projects = thirdParty하지만 만약 내가 리스트를 연결한다면thirdParty와 함께_projects동작되지 않습니다.

  mounted() {
 var _projects = [];
   var thirdParty = [];
 axios.get("http://127.0.0.1:5000/api/projects?placeholder=darwin")
     .then(response => {
       this.selectedBranch = "";
       _projects = [{"projectType": "Github Projects", "grpValues": response.data.projects}]
       console.log("Github" + response.data.projects);
       console.log(_projects);

     })



  axios.get("http://127.0.0.1:5000/api/thirdparty")
   .then(response => {
   console.log(_projects);
   thirdParty = [{"projectType": "Thirdparty Projects", "grpValues": response.data}]
   _projects.concat(thirdParty);
   this.projects = _projects
   })

어떤 도움이라도 크게 감사할 것이다.

concat기존 어레이를 변경하지 않고 새 어레이를 반환하십시오.대신 다음을 시도해 보십시오.

_projects = _projects.concat(thirdParty);

더 좋은 건 변이하지 말라는 거야_projects에 직접 할당하는 대신this.projects:

this.projects = _projects.concat(thirdParty);

아니면 둘 다보다 더 잘 쓰세요.Promise.all두 가지를 동시에 추가하려면:

async mounted() {
  const [darwinProjectResponse, thirdPartyResponse] = await Promise.all([
    axios.get("http://127.0.0.1:5000/api/projects?placeholder=darwin"),
    axios.get("http://127.0.0.1:5000/api/thirdparty")
  ]);
  this.projects = [{
    "projectType": "Github Projects",
    "grpValues": darwinProjectResponse.data.projects,
  },{
    "projectType": "Thirdparty Projects",
    "grpValues": thirdPartyResponse.data,
  }];
}

참조URL: https://stackoverflow.com/questions/49583899/combining-results-of-two-rest-resources-to-grouped-items-in-vue-multiselect