react 犯错记录

1. react的component标签语法

import React from 'react';
import { connect } from 'dva';
const Life = ({ dispatch, products }) => {
  return (
    <div>
      <h2>这是friend页</h2>
    </div>
  );
};
// 把函数包装成了component组件export出去;
export default connect()(Life);

import Life from './life'
<TabBar>
    <TabBar.item>
        {Life}   //出错！！！
    </TabBar.item>
</TabBar>

通过connect封装之后，就会变成标签，要有标签语法去引用；

import Life from './life'
<TabBar>
    <TabBar.item>
        <Life/>   //通过标签形式
    </TabBar.item>
</TabBar>

如果没有经过connect封装则可以直接，因为返回的是div

import React from 'react';
import { connect } from 'dva';
const Life = () => {
  return (
    <div>
      <h2>这是friend页</h2>
    </div>
  );
};
// 直接输出函数
export default Life;

import Life from './life'
<TabBar>
    <TabBar.item>
        {Life()}   //纯函数的话写成函数调用形式是可以的，毕竟返回的是div；
        <Life/>    //纯函数也可以写成这种形式
    </TabBar.item>
</TabBar>

//但不能直接在</>里面写函数，<符号后面不能有空格或其他符号（
//具体的语法编译逻辑有待学习。。。

ps：import 是引用，require是复制