Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 23.06.2018, 04:30
Интересующийся
Отправить личное сообщение для Zhanadil1509 Посмотреть профиль Найти все сообщения от Zhanadil1509
 
Регистрация: 30.07.2017
Сообщений: 10

Вытащить из json блок данных (ReactJS, API)
Приветствую всех! У меня такая проблема: хочу вытащить данные эти в "li", которых выделил в красном квадрате (см.картинку-2, ниже представлен код) Подскажите, не могу найти в гугле.

P.S: Вывод хочу чтобы был таков (см.картинку-1): в "option" выбираю определенный биткоин, а там именно его блока данные выходят в "li"

Пример:

Картинка-1









Картинка-2




import React from 'react';
import axios from 'axios'


export default class Bitcoin extends React.Component {

    state = {
        persons: []
    }

    componentDidMount() {
        axios.get(`https://api.coinmarketcap.com/v1/ticker/?limit=0`)
            .then(res => {
                const bitcoins = res.data
                this.setState({ bitcoins })
            })
    }

    render() {
        return(
            <div>
                {
                    (<select>
                    { this.state.bitcoins.map((bitcoin) => (
                        <option> {bitcoin.name} - {bitcoin.price_usd}$  </option> ) )
                    }
                </select>) ? <ul> { this.state.bitcoins.map((bitcoin) => <li>
                        { bitcoin.id }
                    </li> ) } </ul> : null
                }
            </div>
        )
    }
}
Ответить с цитированием
  #2 (permalink)  
Старый 23.06.2018, 04:57
Интересующийся
Отправить личное сообщение для Zhanadil1509 Посмотреть профиль Найти все сообщения от Zhanadil1509
 
Регистрация: 30.07.2017
Сообщений: 10

приблизительно нашел, схожий ответ. Но не полный
Вот пока, что в голову пришло:







(подсобите )
код изменился вот так :

import React from 'react';
import axios from 'axios'


export default class Bitcoin extends React.Component {

    state = {
        bitcoins: []
    }

    componentDidMount() {
        axios.get(`https://api.coinmarketcap.com/v1/ticker/?limit=0`)
            .then(res => {
                const bitcoins = res.data
                this.setState({ bitcoins })
            })
    }

    bitcoinView() {
        var x = document.getElementById("mySelect").value
        document.getElementById("conclusion").innerHTML = "You selected: " + x
    }

    render() {
        return(
            <div>
                {   <select id="mySelect" onChange={this.bitcoinView}>
                        { this.state.bitcoins.map((bitcoin) => (
                            <option value={bitcoin.symbol}> {bitcoin.name} - {bitcoin.price_usd}$  </option> ) )
                        }
                    </select>
                }
                <p id="conclusion"></p>
            </div>
        )
    }
}
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Способы получения данных в формате json со стороннего ресурса dmitry111 Общие вопросы Javascript 11 30.01.2013 20:58
Двойная Фильтрация данных таблицы David0707 Общие вопросы Javascript 0 19.03.2012 13:00
передача формой данных в JSON формате DarkN Элементы интерфейса 3 20.01.2011 18:45
Преобразование данных json в массив LA_ Общие вопросы Javascript 4 28.10.2010 23:54
Преобразование данных с сервера в JSON frolvict Общие вопросы Javascript 1 04.04.2010 12:26