Fetch ,как в заголовок header передать строку из input?

Алексей Ярков,

<template> 
 <div> 
 <h1>LeadHit</h1> 
 <form class="card auth-card" [id305091293|@submit].prevent="submitHandler"> 
 <div class="card-content"> 
 <span class="card-title"></span> 
 <div class="input-field"> 
 <input 
 id="email" 
 type="text" 
 v-model.trim="email" :class="{invalid: ($v.email.$dirty && !$v.email.required) || ($v.email.$dirty && !$v.email.minLength) || ($v.email.$dirty && !$v.email.maxLength)}" 
 > 
 <label for="email">Leadhit-Site-Id</label> 
 <small class="helper-text invalid" 
 v-if="$v.email.$dirty && !$v.email.required" 
 >id сайта должен содержать 24 символа</small> 
 <small class="helper-text invalid" 
 v-else-if="$v.email.$dirty && !$v.email.maxLength" 
 >id сайта должен содержать "НЕ БОЛЕЕ" {{$v.email.$params.maxLength.max}} символов. Сейчас он {{email.length}}</small> 
 <small class="helper-text invalid" 
 v-else-if="$v.email.$dirty && !$v.email.minLength" 
 >id сайта должен содержать "НЕ МЕНЕЕ" {{$v.email.$params.minLength.min}} символов. Сейчас он {{email.length}}</small> 
 </div> 
 </div> 
 <div class="card-action"> 
 <div> 
 <button 
 class="btn waves-effect waves-light auth-submit" 
 type="submit" 
 > 
 Войти 
 </button> 
 </div> 
 </div> 
</form> 
</div> 
</template> 
 
<script> 
import { required, minLength, maxLength } from 'vuelidate/lib/validators' 
 
export default { 
 name: 'login', 
 data: () => ({ 
 email: '' 
 }), 
 validations: { 
 email: { required, minLength: minLength(24), maxLength: maxLength(24) } 
 }, 
 methods: { 
 submitHandler () { 
 if (this.$v.$invalid) { 
 this.$v.$touch() 
 return 
 } 
 fetch('https://track-api.leadhit.io/client/test_auth', { 
 method: 'GET', 
 headers: { 
 'Api-Key': '5f8475902b0be670555f1bb3:eEZn8u05G3bzRpdL7RiHCvrYAYo', 
 'Leadhit-Site-Id': вставить код из input  
 } 
 }) 
 const formData = { 
 email: this.email 
 } 
 console.log(formData) 
 this.$router.push('/analytics') 
 } 
 } 
} 
</script>

React API вывод данных?

McBernar, Попробовал по разному , но так и не понял , что вы имеете в виду , код от Егор Живагин
работает, но все в одну линию , я думаю ка кто же можно деструктурировать что бы было просто { name } и в том же списки вывести все аккуратно , а не в одну строку

React API вывод данных?

McBernar,

render() {

            const shar = this.state.person.map(results => results.name)
        return (
            <div>
               <ul>
                  <li>
                  { this.char }
                  </li> 
               </ul>
                   
                
            </div>
        );
    }

А, так что не правильно ?

React API вывод данных?

Егор Живагин, Спасибо

React API вывод данных?

McBernar,

render() {
        char = this.state.person.map(results => (
            results.name))

        return (
            <div>
                <h1>
                 {char}
                </h1>
            </div>
        );
    }

может тут я туплю
я, уже все что можно перепробовал , бывает пишет просто TypeError: Cannot read property 'map' of null

React API вывод данных?

Постоянно ошибки выдает

React API вывод данных?

Never Ever,

1.js
export default class Service {

_apiBase = 'https://swapi.co/api';
async getResource(url) {
const res = await fetch(`${this._apiBase}${url}`);

return await res.json();
}

async getAllPeople() {
const res = await this.getResource(`/people/`);
return res.results
// .map(results => results.name);
}

}

2.js
import React, { Component } from 'react';
import Service from './Services';

export default class App extends Component {

service = new Service();


state = {
person: null
}

componentDidMount() {
this.service.getAllPeople()
.then((res) => {
this.setState({
person: res,
})
console.log(res.map(results => (
results.name
)));
})


}



render() {

return (





);
}
}

React API вывод данных?

Never Ever, Это что такое ?

Как вынести текст за приделы слайдера?

Ankhena, не получается по вашему примеру , мне нужно что бы текст был слева от слайдера и в отдельном блоке .