programing

Vue 라우터에서의 JSON 반환

copyandpastes 2022. 7. 30. 21:47
반응형

Vue 라우터에서의 JSON 반환

사용자가 앱에서 /nav를 누르면 JSON 객체를 반환해야 합니다.이 JSON은 프로그래밍 방식으로 사용되며 문자열로만 사용할 수 없습니다.

JSON만의 vue 컴포넌트를 만드는 방법이 있나요?또는 라우터에 JSON을 반환하도록 지시하는 방법?

감사해요!

저도 비슷한 문제가 있었어요.저는 /nav가 JSON을 반환하기를 원했지만, 로컬 개발 서버에서만 반환되었습니다.

그래서 제가 만든 건vue.config.js파일(내 앱 루트 폴더)

module.exports = {
  devServer: {
    before: function(app, server) {
      app.get('/nav', function(req, res) {
        const result = { x:1 , y : "hello" };
        res.writeHead(200, {'Content-Type': 'application/json'});
        res.end(JSON.stringify(result));
      });
    }
  }
}

실행할 때 이 파일을 사용하여npm run serve로 이동하면 json 오브젝트가 표시됩니다./nav그렇지 않으면 일반 앱도 사용할 수 있습니다.

JSON만의 vue 컴포넌트를 만드는 방법이 있나요?

JSON만의 vue 컴포넌트를 생성하는 대신 JSON 개체를 생성하여 내보냅니다.

jsonInput.js

export const jsonInput = [
  { id: "1", title: "Mars" },
  { id: "2", title: "Venus" },
  { id: "3", title: "Pluto" }
];

JSON 개체를 구성 요소로 가져옵니다.

행성들.표시하다

<script>
    import {jsonInput } from './jsonInput';
    export default {
      data(){
          return {
              planets : jsonInput 
          }
       }
    }
</script>

언급URL : https://stackoverflow.com/questions/46699064/returning-json-with-vue-router

반응형