https://github.com/queeniecplusplus/react_router

SPA 需要路由器將 url path 導向正確的元件，其他框架則是導向函數
https://github.com/queeniecplusplus/react_router

es5-javascript reactjs

Last synced: about 1 year ago
JSON representation

SPA 需要路由器將 url path 導向正確的元件，其他框架則是導向函數

• Host: GitHub
• URL: https://github.com/queeniecplusplus/react_router
• Owner: QueenieCplusplus
• Created: 2020-07-11T04:25:44.000Z (over 5 years ago)
• Default Branch: master
• Last Pushed: 2020-08-04T03:10:24.000Z (over 5 years ago)
• Last Synced: 2025-01-06T04:23:30.556Z (about 1 year ago)
• Topics: es5-javascript, reactjs
• Homepage: https://github.com/QueenieCplusplus/QuickGoThru/blob/master/README.md#react
• Size: 2.93 KB
• Stars: 0
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

          
# React_router

SPA 需要路由器將 url path 導向正確的元件，其他框架則是導向函數

# {withRouter}

    (to be continued...)

# {NavLink}

    (to be continued...)

# react-router

      //2020, 7/11, am 11:20- 12:20 (Duration: 20 mins)

      // React Router Component

      // react-router Framework

      //  is a component

      // func is also a component

      // url: /abc -> render AppComponent which is the handlerComponent

      // Routes 元件內包覆很多 Route 元件 指向 path url 和指定處理器（又稱為函數）

      var Route = require("react-router").Route;

      var ksAppRouter = (

          

              

              

              

              

          

      );

      // top level component renderer

      React.renderComponent(

          ksAppRouter,

          document.querySelector('body')

      )

# BackBone Router

      // BackBone Framework 運作方式很像 Django 或是 CI in PHP

      // url: /abc -> execute func -> load data from server to browser and render on  component

      var KRouter = Backbone.Router.extend({

          routes:{

             // "/url": "func name"

             "abc": "funcall"

          },

          funcall: function(){

              React.renderComponent(

                  ,

                  document.querySelector('body')

              );

          }

      });