Reactコンポーネントを個別にコンパイルして提供する

Question

Laravel Mixを使用して反応コンポーネントをコンパイルし、それぞれのページに個別に提供します。これはSPAではありません。

私はリアクトには新しいので、私の無知を許してください。私は現在の設定の周りに頭を抱えて、それが同じページに複数のコンポーネントを持つ適切な方法であるかどうかを調べようとしています。

Soは以下定型のみ例えば、一部のコンポーネントはまた、ストアの作成方法で若干異なる

'use strict' 
import React from 'react' 
import ReactDOM from 'react-dom' 
import {Provider} from 'react-redux' 
import {createStore, applyMiddleware, compose} from 'redux' 
import ReduxPromise from 'redux-promise' 
import App from './containers/App' 
import reducers from './reducers' 

const composeEnhancers = window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ || compose 
const enhancer = composeEnhancers(
    applyMiddleware(ReduxPromise), 
) 
const newstore = createStore(reducers, enhancer) 

ReactDOM.render(
    <Provider store={newstore}> 
     <App /> 
    </Provider>, document.querySelector('.component-foo') 
) 

セレクタを、例えば：変更、すべてのコンポーネントにコピーと貼り付けられましたredux devtoolsは常に存在するとは限りません。

だから、私にはあまり意味がありませんVue.js、から来て - あなたは、フレームワークに関連するすべてのものを輸入して、あなたが単一で必要な各コンポーネントをロードするために1つのファイルを使用したいVue.jsにコード行しかし、このReactセットアップは、Vue.jsに複数のroot/appコンポーネントがあるかのように、ReactとReduxの別々のインスタンスをページ内のすべてのコンポーネントにロードすることとはかなり逆の動作をしているようです。

Reactがバンドルされていて、何度も起動したと仮定するのは正しいですか？

Answer 1

あなたはほとんど間違いなくこれをやっています。そうです、Reactを複数回バンドルしてブートしている可能性は非常に高いですが、それは適切なやり方ではありません。 Vueのパラダイムを使って、React SPAからコピーされたコードを使用しようとしているようですが、なぜこの怪物を構築しているのでしょうか？

基本的なreact + laravelチュートリアルを確認してから続行することをおすすめしますか？シンプルなgoogle検索ではこれが示されました：https://code.tutsplus.com/tutorials/build-a-react-app-with-laravel-backend-part-2-react--cms-29443と私は確信しています。

あなたは新しい反応があるので、今すぐ還元してください。複数のコンポーネントに反応することに慣れてください。あなたがそれを必要とする場合にのみ、還元国管理を追加してください。