[Vssue]React-Router - Githubissues

shenghy commented 5 years ago

https://jspang.com/posts/2019/07/31/react-router.html

chinaBerg commented 5 years ago

第一条评论占座。嘿嘿！！胖哥，一如既往的好，感谢分享、感谢为后来者指路。百尺竿头、日进一步，我是愣锤，大爱胖哥！

ZTH520 commented 5 years ago

前排打卡感谢分享，支持胖哥。

1129zaj commented 5 years ago

胖哥后面会加上TS不？

chenqkhub commented 5 years ago

老哥，关于路由的定义，如果要从登录页跳转到主页面，这种路由怎么配置，使用什么方式跳转

Chris-root commented 5 years ago

看着简单，轮到自己写的时候就一脸的懵，怎么不跳转呢，说好的路由呢/(ㄒoㄒ)/~~

nuonuonuonuoyan commented 5 years ago

胖哥，有个小问题哦，这里讲嵌套路由的时候，一般项目里都是需要默认展示第一个子路由的，然后进行点击切换，像那种固定底部的tabbar之类的，这里我的实现方法是在子路由配置那里再加一个重定向，定向到第一个子路由，不知是不是标准写法？

zhx60403 commented 5 years ago

Vue-Router看起来比React-Router简单多了

Charbo23 commented 5 years ago

@nuonuonuonuoyan

胖哥，有个小问题哦，这里讲嵌套路由的时候，一般项目里都是需要默认展示第一个子路由的，然后进行点击切换，像那种固定底部的tabbar之类的，这里我的实现方法是在子路由配置那里再加一个重定向，定向到第一个子路由，不知是不是标准写法？

其实多加一个Route就行，比如要把/video/vue的内容当成video的默认展示，就加一个Route，path写/video ，component还是写vue，记得一定要加exact否则子页面会重复渲染默认的内容

kaminaning commented 5 years ago

求教第九节中从后端获取数据，怎么把字符串转换成变量名？从后端获取的是这种格式的JSON对象 { "path": "/", "title": "博客首页", "exact": true, "component": "Index" }, { "path": "/video/", "title": "视频教程", "exact": false, "component": "Video" }, { "path": "/workplace/", "title": "职场技能", "exact": false, "component": "WorkPlace" }，想把"component"字段的值从字符串转换成变量名（如“Index”变成 Index）应该这么操作？

Charbo23 commented 5 years ago

@kaminaning

求教第九节中从后端获取数据，怎么把字符串转换成变量名？从后端获取的是这种格式的JSON对象 { "path": "/", "title": "博客首页", "exact": true, "component": "Index" }, { "path": "/video/", "title": "视频教程", "exact": false, "component": "Video" }, { "path": "/workplace/", "title": "职场技能", "exact": false, "component": "WorkPlace" }，想把"component"字段的值从字符串转换成变量名（如“Index”变成 Index）应该这么操作？

大概讲一下思路吧，首先呢这个肯定是要用到组件的异步加载了，这个有很多种方法可以百度下，然后呢怎么把字符串对应组件呢，首先想想我们如果写死在代码里的话，肯定是通过import一个路径事先已经导入了Index组件了，所以说我认为如果要动态导入那么还得写一个组件名对应组件路径的静态表，比如

const componentMap = {
    'Index': '@/pages/Index'
};
//最好是绝对路径以免出错（这里的@是定义的别名，对应src文件夹，需要配置webpack的alias）

异步加载组件的用法可以参考https://blog.seosiwei.com/detail/10 我用的是第四种

Linbubin commented 5 years ago

patch:自己定义的路由规则，可以清楚的看到是可以产地id参数的。

错别字 patch -> path

52javascript commented 5 years ago

工作中用的多的应该是编程式导航，vue-router和react-router应该都是，为什么不讲讲编程式导航呢

benBenXuChao commented 5 years ago

把"component"字段的值从字符串转换成变量名（如“Index”变成 Index）我是这么做的 import Video from './component/video' const routeConfig= [{ path: '/video/', exact: false, title: '精彩视频', component: 'Video' }, ] const configToCom = { Video } {routeConfig.map((item, index) => <Route key={index} exact={item.exact} path={item.match || item.path} component={configToCom[item.component]} />)}

shenghy / my-blog

[Vssue]React-Router #41