0

contentful のヘッドレス CMS を試してみることにしましたが、API クライアントで問題が発生しています。私がやろうとしているのは、サーバー側のレンダリングのためにエクスプレスと反応を結婚させることであり、このレポを出発点として使用しています。

私の高速ルーター

React コンポーネントが呼び出すことができるルートを作成します。

createApiRouter(app) {
    const router = express.Router();

    this.createHeroesRoute(router);
    // this.createDetailedBillRoute(router);        
    return router;
},

createHeroesRoute(router) {
    router.get('/get-heroes', (req, res) => {
      this.getHeroes((err, data) => {
        if(!err) {
          res.json(data);                                    
        } else {
          res.status(500).send(err);
        }
      });
    });
},

Contentful からデータを取得する

getHeroes(callback) {
    contentfulClient.getEntries({content_type: 'sectionHeroes'})
      .then((entries) => {
        //serilizations is a custom data serializer to format this data, it's working fine
        return JSON.parse(serializations.serializeMainSection(entries.items[0]))
      })
      .catch((error) => error );
}

私のReactコンポーネント

データをリクエストする

static requestData(params, domain = '') {
    return axios.get(`${domain}/api/get-heroes`);
}

コンポーネントの状態を受信したデータに設定します

componentDidMount() {
    this.constructor.requestData().then((response) => {
      this.setState(response.data);
    }).catch((err) => {
      throw new Error(err);
    });
}

getHeroesExpress 内のメソッドで障害が発生しています。contentful の client は promise であるため、getHeroesRouteからの戻りを待機させる方法がわかりませんgetHeroes。これどうやってするの？

4

2 に答える 2

0

promise が解決されたときに createHeroesRoute() が getHeroes() に渡すコールバックを呼び出す必要があります。getHeroes() をこれに変更する必要があります。

getHeroes(callback) {
    contentfulClient.getEntries({content_type: 'sectionHeroes'})
        .then((entries) => {
            callback(JSON.parse(serializations.serializeMainSection(entries.items[0])));
        })
       .catch((error) => error );
}

JSON.parse がすべて機能すると仮定します。

于 2016-08-11T22:27:26.837 に答える