React get传值

此处用到的url模块,当然方法有很多,也可以用其他方法。

1.列表页

 {item.name}

完整案例
传输值页面

import React, {Component} from 'react';
import '../assets/css/Cty.less'
import { Link } from "react-router-dom";

class Cty extends Component{
    constructor(props){
        super(props)
        this.state ={
           list:[
              {
                name:'主页',
                uid:'1'
             },
             {
                name:'热点',
                uid:'2'
             },
             {
                name:'常规',
                uid:'3'
             },
             {
                name:'遇见',
                uid:'4'
             },
             
           ],
        }
    }
    render(){
        return(
            

我是cty

{ this.state.list.map((item,key) => { return ( {item.name} ) }) }
) } } export default Cty;

接收值得页面

import React,{Component} from 'react'
import url from 'url'          // 引入url 模块

class Getdata extends Component {
    constructor(props) {
        super(props);
        this.state = {
            msg:'getdata页面'
          };
    }
    // 页面加在完成
    componentDidMount(){
        let miu = url.parse(this.props.location.search,true);    // 解析地址
        console.log(miu.query);
    }
    render() {
        return (
           
{this.state.msg}
); } } export default Getdata;

这样我们就完成了,如果对你有帮助,就点个赞吧!
如果有问题,可以加我微信一起讨论,我们一起进步!
屏幕前的你,加油!

React get传值_第1张图片

你可能感兴趣的:(react)