Question

我使用的是图书馆：https://www.npmjs.com/package/react-editext。我尝试从编辑按钮中删除text-decoration: line-through，并在从取消和提交按钮中按编辑按钮时删除。它尝试赋予按钮text-decoration: none !important样式，但是删除线不会从按钮中消失。

此处演示：https://stackblitz.com/edit/react-dmfbqc

图片：https://imgur.com/O5hb715

CSS

.lineThrough {
  text-decoration: line-through;
}

.styles_Editext__button__6H8n_, .styles_Editext__edit_button__hthOZ {
  text-decoration: none !important;
}

.styles_Editext__save_button__3WN6q {
  text-decoration: none !important;
}

.styles_Editext__cancel_button__259hb {
  text-decoration: none !important;
}

javascript

import React, { Component } from 'react';
import { render } from 'react-dom';
import './style.css';
import EdiText from 'react-editext'


class App extends Component {
  constructor() {
    super();
    this.state = {
      name: 'React'
    };
  }

  onSave = val => {
   console.log('Edited Value -> ', val)
  }

  render() {
    return (
      <div className="lineThrough">
        <EdiText
          type="text"
          value='What is real? How do you define real?'
          onSave={this.onSave}
        />
      </div>
    );
  }
}

Answer 1

尝试一下::

css文件::

<div>
        <EdiText
          type="text"
          value='What is real? How do you define real?'
          viewContainerClassName='lineThrough__none'
          onSave={this.onSave}
        />
      </div>

索引js ::

.grid {
  display: grid;
}

textarea:not([cols]) {
  width: 100%;
}

此处演示：https://stackblitz.com/edit/react-ntqzyc?file=index.js

此处输出：https://react-ntqzyc.stackblitz.io/

Answer 2

可能是：

您尚未导入.js文件中所需的所有内容。
或者您还没有定义onSave()函数。类似于：onSave = val => { console.log('Edited Value -> ', val) }

如何从库react-editext中的按钮中删除“ text-decoration：line-through”？

2 个答案: