0xD34F

Может написать регулярку, которая будет убирать только первый и последнии слеши?

Зачем такие сложности? Вы знаете, что лишними в строке являются первый и последний символы - ну так может, их и отрезать? - типа, .slice(1, -1).

Ну и если вдруг объект regexp используется только для задания значений атрибута pattern, то пусть его свойства будут сразу строками, а не регулярными выражениями. И ещё, зачем делать его обычным полем класса? - так будет создаваться отдельный объект для каждого экземпляра. Пусть будет статическим или вообще не принадлежит классу.

Забыли:

ReactDOM.render(
  <News data={myNews} />,
  document.querySelector('#root')
);

{thematics.map((thematic, i, a) => (
  <div>
    <div style={style1} key={thematic.id}>
      {thematic.id}
    </div>

    {i < a.length - 1 ? <div style={style2} /> : null}
  </div>
))}

Выполняете setState до получения ответа (метод onSearchChange).

https://ru.reactjs.org/docs/faq-ajax.html#where-in...

Какой атрибут? Key? Нет такого атрибута у элемента, key для другого нужен.

Хотите знать id в обработчике клика - сделайте какой-нибудь другой атрибут, не key. Например:

data-id={user.id}

const elemId = +e.currentTarget.dataset.id;

И - иммутабельность:

this.setState(({ events }) => ({
  events: events.map(n => n.id === id ? { ...n, title: newTitle } : n),
}));

{this.state.image}

меняйте на

<img src={this.props.items[this.state.image].img} />

, а

<App />

на

<App items={items} />

UPD. https://jsfiddle.net/69f71jbk/

function App() {
  const [ values, setValues ] = useState(Array(10).fill(''));

  const onChange = ({ target: t }) => {
    const index = +t.dataset.index;
    const value = t.value;

    setValues(values.map((n, i) => i === index ? value : n));

    if (index < values.length - 1 && value) {
      inputRefs.current[index + 1].focus();
      inputRefs.current[index + 1].select();
    }
  };

  const inputRefs = useRef([]);

  return (
    <div>
      {values.map((n, i) => (
        <div>
          <input
            value={n}
            data-index={i}
            onChange={onChange}
            ref={input => inputRefs.current[i] = input}
            maxLength="1"
          />
        </div>
      ))}
    </div>
  );
}

state = {
  likes: localStorage.getItem('likes') | 0,
}

plus = () => {
  this.setState(({ likes }) => ({
    likes: likes + 1,
  }), () => localStorage.setItem('likes', this.state.likes));
}

this.setState(({ appData }) => ({
  appData: {
    ...appData,
    unfinished: {
      ...appData.unfinished,
      [name]: value,
    },
  },
}));

this.setState(({ books }) => ({
  books: [ ...books, ...newBooks ],
}));

const withWrapper = (ComponentToWrap) => (props) => {
  return <div className="Wrapper"><ComponentToWrap {...props} /></div>;
};

const WrappedMain = withWrapper(Main);

render() {
  return (
    <WrappedMain />
  );
}

xmlnsXlink="http://www.w3.org/1999/xlink"

return {
  arr: {

Если arr массив, почему пытаетесь превратить его в объект?

this.setState(({ arr }) => ({
  arr: arr.map((n, i) => i === posX
    ? n.map((m, j) => j === posY ? 1 : m)
    : n
  ),
}));

state: State<T> = {
  selectedItems: []
}

renderListItem: ({ item: T }) => T = ({ item }) => {
  return item;
}

const ChildComponent = (props) => (
  <div
    className={`childComponent ${props.isActive ? 'active' : ''}`}
    onClick={props.onClick}
    data-id={props.id}
  >
    <h3>{props.text}</h3>
  </div>
);


const ParentComponent = ({ items }) => {
  const [ active, setActive ] = React.useState(null);

  const onClick = e => setActive(+e.currentTarget.dataset.id);
  // или
  // const onClick = e => setActive(+e.target.closest('[data-id]').dataset.id);

  return (
    <div>
      {items.map(n =>
        <ChildComponent
          key={n.id}
          onClick={onClick}
          isActive={n.id === active}
          {...n}
        />
      )}
    </div>
  )
};


ReactDOM.render(
  <ParentComponent
    items={[
      { id:  69, text:  'hello, world!!' },
      { id: 187, text:  'fuck the world' },
      { id: 666, text: 'fuck everything' },
    ]}
  />,
  document.getElementById('root')
);

<Body tmp={this.state.body.json.result} />

{this.props.tmp.map(n => <div key={n._id}>{n.name}</div>)}

Замените

сhangeHandler={() => changeTodo(todo.id)}

на

сhangeHandler={changeTodo}