小编HaZ*_*ker的帖子

如何改变 Ant 设计 Tooltip 的宽度

我想更改工具提示的宽度,但我不能。
我该怎么做呢?

import React, { FunctionComponent } from 'react';
import {Tooltip} from "antd";
import 'antd/dist/antd.css';

export interface Props {
  tooltipeText: string
}

const hintWithTooltipeStyle = {
  position: 'relative' as 'relative',
  left: 5,
  top: 1
};


const HintWithTooltipe: FunctionComponent<Props> = ({
  tooltipeText
}: Props) => {
  return (
    <span style={hintWithTooltipeStyle}>
      <Tooltip placement="rightTop" title={tooltipeText} style={{width: 700, maxWidth: '500px !important'}}>
        <Button>Ant design</Button>
      </Tooltip>
    </span>
  );
};

export default HintWithTooltipe;
Run Code Online (Sandbox Code Playgroud)

内联样式不起作用。
根本没有任何风格

css typescript reactjs antd

2
推荐指数
2
解决办法
3639
查看次数

条件(动态)解构

根据所选的语言,我需要破坏对象并获得所需的值。
我该怎么做才能不破坏整个对象?

const translate = {
   "navMenu1": {
      "en": "Menu 1",
      "ru": "???? 1"
   },
   "navMenu2": {
      "en": "Menu 2",
      "ru": "???? 2"
   },
   "navMenu3": {
      "en": "Menu 3",
      "ru": "???? 3"
   }
}

const Header = props => {
  const { lang } = props;

  const {
    navMenu1,
    navMenu2,
    navMenu3
  } = translate;

  return (
    <header className={cnGreetingHeader}>
      <div>-Logo-</div>
      <nav className={cnNav}>
        <div className={cnItem}>{navMenu1[lang]}</div>
        <div className={cnItem}>{navMenu2[lang]}</div>
        <div className={cnItem}>{navMenu3[lang]}</div>
      </nav>
    </header>
  );
};
Run Code Online (Sandbox Code Playgroud)

我想要

<div className={cnItem}>{navMenu1[lang]}</div> 
Run Code Online (Sandbox Code Playgroud)

<div className={cnItem}>{navMenu1}</div>
Run Code Online (Sandbox Code Playgroud)

重要提示:如果可能,我想要一个使用解构赋值的答案。

javascript destructuring ecmascript-6 reactjs

2
推荐指数
1
解决办法
107
查看次数