CDN ile ve WebPack olmadan Router Tepki veya

Devam browserify kullanma: Ben wepback veya benzer araçlar olmadan Yönlendirici Tepki çalıştırmanız gerekir. Doğrudan CDN bağlantılardan, ancak bazı require.js hata ile sıkışmış. CDN ile ve WebPack olmadan Router Tepki veya

İlk Uygulamayı React ile oluşturmaya başladım ve React Router ile boğuşuyorum.

HTML:

<body> 
    <div id="container"></div> 


    <script src="https://unpkg.com/[email protected]/dist/react.js"></script> 
    <script src="https://unpkg.com/[email protected]/dist/react-dom.js"></script> 
    <script src="https://cdnjs.cloudflare.com/ajax/libs/babel-core/5.8.23/browser.js"></script> 

    <script src="https://npmcdn.com/[email protected]/umd/ReactRouter.js"></script> 

    <script type="text/babel" src="assets/scripts/03_templates/app.js" charset="utf-8"></script> 

</body>

JS:

var { Router, Route, IndexRoute, hashHistory, IndexLink, Link, browserHistory } = ReactRouter; 

//some classes 

ReactDOM.render((
    <Router history={hashHistory}> 
     <Route path="/" component={Window}> 
      <IndexRoute component={InitialPage}/> 
      <Route path="register" component={Register} /> 
      <Route path="search" component={Search} /> 
     </Route> 
    </Router> 
), document.getElementById("container"));

Her şey iyi çalışıyorsa ama konsolda bu olsun:

react.js:3639 Warning: You are manually calling a React.PropTypes validation function for the getComponent prop on IndexRoute . This is deprecated and will not work in production with the next major version. You may be seeing this warning due to a third-party PropTypes library.

Yani, benim herhalde Yönlendirici bir eski tepki sürümü. Ben

Bu konuda arama

<script src="https://cdnjs.cloudflare.com/ajax/libs/react-router/4.0.0-0/react-router.js"></script>

Warning: React.createElement: type should not be null, undefined, boolean, or number. It should be a string (for DOM elements) or a ReactClass (for composite components).

bağlantısını değiştirmiş olup, bunun sorunun hattı 1. Yani bu değişmiş görünüyor: Buna

var { Router, Route, IndexRoute, hashHistory, IndexLink, Link, browserHistory } = ReactRouter;

import { Router, Route, IndexRoute, hashHistory, IndexLink, Link, browserHistory } from 'react-router';

Ve şimdi bu sorun var:

Ben require.js aramış bazı şeyler denedik ama hiçbir şey benim sorun giderildi. Neyi kaçırıyorum? Bunu web paketi veya benzeri araçlar olmadan çalıştırmam gerekiyor.

teşekkürler javascript üstünde

kaynak

2016-11-23 sandrina-p

bunu kullanın:

var Router = ReactRouter.Router; 
var Route = ReactRouter.Route; 
var IndexRoute = ReactRouter.IndexRoute; 
var Link = ReactRouter.Link; 
var browserHistory = ReactRouter.browserHistory;

ve import ifadeleri kaldırın.

Şu anda bu tepki-yönlendirici paketini kullanıyorum: https://unpkg.com/[email protected]/umd/ReactRouter.js

DÜZENLEME:

İşte CodePen de bir örnek: http://codepen.io/lsmoura/pen/pNPOzp - hiçbir içe aktarma ifadelerini kullanıyor. için

kaynak

2016-11-23 12:35:04

4.0.0 ile benzer bir şey denedim ve çalışmadı. 3.0.0 ile çok kolay hayır çok teşekkür ederim! –

yol V4 reaksiyona girmektedir.Kullanabileceğiniz

<script src="https://unpkg.com/react-router/umd/react-router.min.js"></script> 
<script src="https://unpkg.com/react-router-dom/umd/react-router-dom.min.js"></script>

js kodunda:

const Router = window.ReactRouterDOM.BrowserRouter; 
const Route = window.ReactRouterDOM.Route; 
const Link = window.ReactRouterDOM.Link; 
const Prompt = window.ReactRouterDOM.Prompt; 
const Switch = window.ReactRouterDOM.Switch; 
const Redirect = window.ReactRouterDOM.Redirect;

console.log(window.ReactRouterDOM);

bütün koymak için kullanabileceğiniz 0, react-router package sayfanızda ikinin js bağlantı eklemek okuyunuz nesne gibi:

ReactRouteDOM Objects

kaynak

2017-08-22 02:23:12 billschen

Ayrıca iç içe yönlendirme için 'const NavLink = window.ReactRouterDOM.NavLink;' 'u da eklemek isteyebilirsiniz. Burada [Codepen'de bir Reaktif Router V4 İç içe Yönlendirme Örneği] (https://codepen.io/schafeld/pen/yzvZPj?editors=1010) –

CDN ile ve WebPack olmadan Router Tepki veya

cevap

İlgili konular