Question

我按照https://www.npmjs.com/package/reactjs-mappletooltip

上的安装说明操作

当我在Chrome中检查页面源时，MappleToolTip中的任何内容都不会呈现甚至显示在页面源中。我究竟做错了什么？我尝试将相同的结果作为单独的组件包含在内，而不是MappleToolTip渲染。

我的代码：（注意：代码已缩短以便于阅读）

ToolTip.js

import React from 'react';

var MappleToolTip = require('reactjs-mappletooltip');

export const PageWithToolTip = () => {
  return(
    <div>
      <MappleToolTip>
        <div>
          Show Mapple Tip on this
        </div>
        <div>
          Hey! this is damn easy        
        </div>
      </MappleToolTip>
    </div>
  );
}

FoodMenu.js

import React, {Component} from 'react';
import {PageWithToolTip} from './ToolTip';

class FoodMenu extends Component{
  render(){
    return(
      <div className="section-meals">
        <div className="row">
          <h2>
            - Menu -
          </h2>
        </div>
        {PageWithToolTip}
      </div>
     )
   }
}

export default FoodMenu;

谢谢！

Answer 1

只需<PageWithToolTip/>而不是{PageWithToolTip}。

并将导入更改为import MappleToolTip from 'reactjs-mappletooltip';

ReactJS - MappleToolTip无法渲染

1 个答案: