Вызовите React Component более одного раза

Question

Вызовите React Component более одного раза

Я хочу сказать, что это противоречит «обычной мудрости», но я обычно предпочитаю использовать размер. Причина этого - причина, по которой многие люди не говорят: ширина поля будет варьироваться от браузера к браузеру, в зависимости от размера шрифта. В частности, он всегда будет достаточно большим, чтобы отображать указанное количество символов, независимо от настроек браузера.

Например, если у меня есть поле даты, я обычно хочу, чтобы поле было достаточно большим, чтобы отображать 8 или 10 символов (две цифры месяца и дня и два или четыре цифры года с разделителями). Установка атрибута размера по существу гарантирует мне, что вся дата будет видна с минимальным затраченным пространством. Аналогично для большинства чисел - я знаю диапазон ожидаемых значений, поэтому я устанавливаю атрибут size в соответствующее количество цифр, а также десятичную точку, если это применимо.

Насколько я могу судить, ни один CSS атрибут делает это. Например, установка ширины в em основана на высоте, а не на ширине, и поэтому не очень точная, если вы хотите отобразить известное количество символов.

Конечно, эта логика не " t всегда применяется - поле ввода имени, например, может содержать любое количество символов. В этих случаях я вернусь к свойствам ширины CSS, обычно в px. Однако я бы сказал, что большинство полей, которые я создаю, имеют какой-то известный контент, и, указав атрибут size, я могу убедиться, что наиболее содержимого в наиболее случаев, отображается без обрезки.

0

javascript reactjs

задан El.Psy.Kongroo 3 March 2019 в 20:06

2 ответа

Другие вопросы по тегам:

javascript reactjs

Похожие вопросы:

score 0 · Answer 1

ReactDOM.render может обрабатывать массив компонентов.

function clickListado() {
    retornoDB(function (data) {
        let json = JSON.parse(data);
        const domContainer = document.querySelector('#en_proceso');

        let Images = json.map((img, index) => <CargarImagen ruta={img.ruta} name={img.nombre} key={index}/>);

        ReactDOM.render(Images, domContainer);

    });
}

score 0 · Answer 2

ReactDOM.render обычно просто для вставки корня вашего приложения в статический div. Вы получаете последний только потому, что продолжаете заменять этот div каждым из компонентов CargarImagen. Вместо этого создайте массив и верните его в JSX вызывающего (родительского) компонента. Вы можете поместить myArray во внутреннее состояние компонента или просто использовать простой объект и вернуть его. Трудно сказать, что именно, как вы реализуете это здесь.

for (var key in json) {
  if (json.hasOwnProperty(key)) {
    myArray.push(<CargarImagen ruta={json[key].ruta} name={json[key].nombre} />);
  }
}