Публикации по теме 'react-jsx'
Все, что вам нужно знать о React JSX
React JSX расшифровывается как JavaScript XML. Это синтаксис для написания HTML-кодов внутри кода JavaScript. JSX обладает всеми возможностями JavaScript. При переводе на обычный JavaScript оптимизация происходит так, что JSX намного быстрее обычного JavaScript. React использует компонент для разделения разметки и логики в отдельных файлах. В этой статье мы обсудим все React JSX вместе с их преимуществами и недостатками.
Синтаксис :
const element = <h1>Hello World!..
Руководство по JSX для новичков
Что такое JSX и зачем его изучать? Давайте поговорим об этом.
JSX в большинстве случаев выглядит как обычный HTML. JSX - это HTML-подобный синтаксис, используемый React, который расширяет ECMAScript, так что HTML-подобный текст может сосуществовать с кодом JavaScript / React. Синтаксис предназначен для использования препроцессорами (то есть транспиляторами, такими как Babel) для преобразования HTML-подобного текста, находящегося в файлах JavaScript, в стандартные объекты JavaScript,..
Условный рендеринг компонентов в React
Лучшие методы в JSX
Вот два лучших способа условного рендеринга компонентов в JSX React без использования уродливого «если еще».
Если у вас есть условие «если еще», используйте тернарный оператор . У вас есть приложение Cookbook, и вы хотите отобразить ‹Еда /›, если пользователь ищет рецепты еды, или ‹Напитки /›, если пользователь ищет рецепты напитков.
Обратите внимание, что isFood может быть состоянием локального компонента или свойством.
Если у вас есть If, но нет else,..
Бесплатные учебники по React для начинающих
Бесплатные руководства по React для начинающих
Краткое введение в React
React - это библиотека JavaScript для создания пользовательских интерфейсов. Это поможет вам сосредоточиться на создании слоя представления как для веб-приложений, так и для мобильных. С увеличением использования одностраничного приложения (SPA) были разработаны такие фреймворки, как Angular , Vue и Ember , чтобы сосредоточиться на архитектуре Model View Controller .
Однако React - это не фреймворк..
10 вещей, которые вы должны знать о JSX
JSX - это язык разметки, который похож на HTML, но на самом деле является расширением синтаксиса для JavaScript. Проще писать код вместо чистого Javascript. Это позволяет разработчикам использовать синтаксис HTML для составления компонентов JavaScript. Поскольку это расширение javascript, браузер не поймет его, если вы не используете компилятор JSX, например Babel. JSX используется для создания элементов React. Он обеспечивает синтаксический сахар для функции React.createElement..
Вопросы по теме 'react-jsx'
jsx --watch преобразует синтаксис jsx в нижний регистр вместо React в верхнем регистре
Я свободно следую учебнику по Facebook React здесь, http://facebook.github.io/react/docs/getting-started.html , но я применяю его к другому html-файлу.
Это мой html-файл, основанный на стартовом комплекте реагирования:
<html>...
1677 просмотров
schedule
22.07.2023
Истинные пользовательские атрибуты (например, микроданные) в React
Сайт, который я разрабатываю, использует микроданные (используя schema.org). Поскольку мы переводим разработку на использование React для визуализации наших представлений, я столкнулся с блокировщиком, в котором React будет отображать только атрибуты...
13602 просмотров
schedule
10.07.2023
Строка как html в reactjs
У меня есть функция, которая возвращает несколько строк html, например:
render: function() {
var badges = user.get('achievements').badges.map(function(badge) {
var str = '<h3><span className="fa fa-fw '
switch(badge.id) {...
6951 просмотров
schedule
15.09.2022
Отображение списка ссылок, разделенных запятыми
Я пытаюсь вывести список ссылок, разделенных запятыми, и это мое решение.
var Item = React.createComponent({
render: function() {
var tags = [],
tag;
for (var i = 0, l = item.tags.length; i < l; i++) {
if (i ===...
21640 просмотров
schedule
18.03.2023
Почему этот список выбора не отображается с правильным элементом, выбранным на основе defaultValue
У меня есть компонент ReactJS :
var RegionsList = React.createClass({
handleChange: function () {
var regionId = this.refs.userRegions.getDOMNode().value;
this.props.onRegionSelected(regionId);
},
componentDidMount:...
8302 просмотров
schedule
01.07.2023
WebPack с ошибкой ссылки React Uncaught
Я очень приблизительно следую примеру здесь вплоть до того момента, когда он начинается запуск сервера разработки.
У меня есть тестовый компонент React (в scripts/test.jsx):
/** @jsx React.DOM */
var React = require('react');
var Test =...
8622 просмотров
schedule
06.11.2022
Есть ли способ использовать JSX в родной среде CommonJS?
Я запускаю новый проект в среде со встроенной поддержкой CommonJS для require модулей — это проект атомной оболочки, нет возможности использовать этапы предварительной компиляции, такие как в Browserify или веб-пакет AFAIK .
Я могу...
1566 просмотров
schedule
30.08.2023
Преобразователь React JSX в Windows
Вроде ничего не делает? Согласно этой фиксации , преобразователь JSX теперь должен работать.
Команда, которую я пытаюсь использовать в данный момент:
C:\Node> node node_modules/react-tools/bin/jsx --watch S:/dev/_res/jsx/ S:/dev/_res/js/...
1572 просмотров
schedule
05.07.2023
Область действия React/JSX
Итак, я пытаюсь интегрировать React в существующую кодовую базу. В настоящее время у нас есть одностраничное веб-приложение, которое управляется файлом common.js, однако я заметил, что если файлы JSX или, по крайней мере, файлы сценариев, загруженные...
563 просмотров
schedule
08.03.2024
Как использовать Jest для тестирования представления React, подключенного к хранилищу?
У меня есть представление React , которое связывается с магазином . Я успешно тестировал представления и хранилища по отдельности, но не вместе.
Я следовал структуре, описанной здесь , но получил TypeError . Похоже, Jest пытается...
1652 просмотров
schedule
11.09.2022
Какие функции ES6 поддерживаются в JSX?
Я использую React with JSX с react-tools для компиляции кода JSX в JavaScript.
Какие функции ES6 поддерживаются в JSX с включенной опцией harmony ?
3735 просмотров
schedule
20.09.2023
Динамический рендеринг компонента React в React 0.12
Я задавал этот вопрос ранее , но с React 0.12 и внесенными в него изменениями JSX я Сейчас ищу другой способ реализовать эту функцию.
Вот код, который работает в React 0.11:
return React.createClass({
render: function() {
var Tag =...
2677 просмотров
schedule
16.10.2022
Имя выходного объекта, отличное от React, с синтаксисом jsx
с React v0.12 прагма @jsx исчезла, что означает, что больше невозможно выводить jsx с чем-либо, кроме синтаксиса React.METHODNAME.
В моем случае использования я пытаюсь обернуть объект React в другой объект, чтобы предоставить некоторые удобные...
340 просмотров
schedule
12.05.2024
Объясните вопросительный знак (?), Используемый в коде ES6/JSX
Я использую библиотеку под названием react-forms в своем приложении React. Чтобы лучше понять, как это работает, я читал код, но постоянно всплывает соглашение, которое меня смущает. Вот код ES6/JSX:
'use strict';
var React =...
8547 просмотров
schedule
24.08.2022
React.js, как передавать обратные вызовы дочерним компонентам?
Я хотел бы передать обратный вызов дважды вложенному компоненту, и хотя я могу эффективно передавать свойства, я не могу понять, как привязать обратный вызов к правильному компоненту, чтобы он срабатывал. Моя структура выглядит так:...
41433 просмотров
schedule
21.11.2022
Как установить состояние компонента контейнера из его дочернего элемента в reactjs и reflux?
У меня есть заголовок, который должен изменять свои внутренние компоненты всякий раз, когда происходит изменение его состояния, например, когда пользователь нажимает кнопку входа в систему, навигация профиля пользователя заменяет кнопку.
Моя кнопка...
706 просмотров
schedule
25.05.2022
ReactJS: this.props не является функцией, когда дочерний компонент вызывает родительский
Я написал этот код и сейчас борюсь с ошибкой в событии onClick. У меня есть два события: событие onClick в дочернем элементе и событие onChange в родительском элементе верхнего уровня.
Ожидаемое поведение должно заключаться в изменении...
29210 просмотров
schedule
30.12.2022
react-typeahead — нарушение инварианта: проблема с addComponentAsRefTo()
Узел v0.12.2
Реагировать v0.13.2
Нпм v2.7.4
Использование стандартного ввода с опережением вызывает следующую ошибку:
Неперехваченная ошибка: нарушение инварианта: addComponentAsRefTo(...): Только ReactOwner может иметь ссылки. Обычно это...
680 просмотров
schedule
25.06.2022
Редактирование JSX в Visual Studio
Я использую Visual Studio 2013 для создания веб-сайта, который использует React и JSX для пользовательского интерфейса. Все это прекрасно работает, но замедляет среду разработки, поскольку файлы .jsx обрабатываются как обычный текст. Таким образом,...
9790 просмотров
schedule
07.04.2023
React.js + bootstrap-table работает только при первой загрузке, но переходы ломают таблицу
Использование http://bootstrap-table.wenzhixin.net.cn
Вот мой компонент, содержащий код таблицы:
var Component = React.createClass({
render: function() {
return (
<div className="col-sm-9 col-sm-offset-3 col-lg-10...
5424 просмотров
schedule
13.10.2022
