Forum |  HardWare.fr | News | Articles | PC | Prix | S'identifier | S'inscrire | Aide | Shop Recherche
429 connectés 

 



 Mot :   Pseudo :  
  Aller à la page :
 
 Page :   1  2  3  4  5  ..  1421  1422  1423  1424  1425  1426
Page Suivante
Auteur Sujet :

blabla@web

n°2337701
masklinn
í dag viðrar vel til loftárása
Posté le 07-08-2019 à 17:10:54  profilanswer
 

Reprise du message précédent :

nraynaud a écrit :


merde, je dois déclencher moi-même du coup?


Genre si ton parent te passe un callback en prop? Oui.


---------------
I've never understood the compulsion to use Web technologies minus the Web's security and deployment models. It seems a bit like throwing the orange away and eating the peel. — @ justinschuh‬
mood
Publicité
Posté le 07-08-2019 à 17:10:54  profilanswer
 

n°2337704
nraynaud
lol
Posté le 07-08-2019 à 17:22:51  profilanswer
 

masklinn a écrit :


Genre si ton parent te passe un callback en prop? Oui.


il faut que je fabrique un "event" du coup, il a quoi comme champs attendus à part 'value' ?


---------------
trainoo.com, c'est fini
n°2337711
flo850
moi je
Posté le 07-08-2019 à 17:58:15  profilanswer
 

tu fais un peu ce que tu veux
par exemple des callback peuvent arriver dans les props  
 
tu as un peu plus de détails ?  
 


---------------

n°2337712
nraynaud
lol
Posté le 07-08-2019 à 18:08:13  profilanswer
 

c'est open source, mais c'est un poil compliqué.
https://github.com/vatesfr/xen-orch [...] al.js#L290
 
je veux utiliser cette fonction form() pour faire l'équivalent de window.prompt()
donc je veux mettre un champ dans le paramètre render.
 
Mon composant a cette gueule:  

Code :
  1. class SshName extends Component {
  2.  state = { value: this.props.value }
  3.  
  4.  _onChange = event => {
  5.    this.setState({value: event.target.value})
  6.    this.props.onChange(event.target.value)
  7.  }
  8.  
  9.  render() {
  10.    return (
  11.      <div>
  12.        <input
  13.          type='text'
  14.          className='form-control'
  15.          onChange={this._onChange}
  16.          value={this.state.value}
  17.        />
  18.      </div>
  19.    )
  20.  }
  21. }


 
mon point d'appel:  

Code :
  1. const username = await form({
  2.      defaultValue: 'root',
  3.      header: <span>SSH user name</span>,
  4.      render: props => <SshName {...props}/>,
  5.      handler: value => {
  6.        console.log('handler', value)
  7.        return value
  8.      },
  9.    })
  10.    console.log('username', username)


 
le résultat pour l'instant c'est que je perds le focus après chaque lettre:  
http://g.recordit.co/fXVMWuCRnj.gif
 
et si j'appelle pas le onChange, le username dans le retour reste la valeur par défaut "root"


---------------
trainoo.com, c'est fini
n°2337713
flo850
moi je
Posté le 07-08-2019 à 18:39:27  profilanswer
 

c'est probablement que react casse et reconstruit l'input
tu veux essayer de mettre key='my-fuckkink-ssh-name-input-container-sa-race' sur le div ?  

 

et le formId change à quel moment ?


Message édité par flo850 le 07-08-2019 à 18:40:18

---------------

n°2337714
nraynaud
lol
Posté le 07-08-2019 à 18:49:47  profilanswer
 

l'id du form n'a pas l'air de changer à chaque frappe de touche, il  a l'air de rester constant.
 
j'ai pas non plus d'amélioration quand j'essaye ça:  

Code :
  1. render() {
  2.    return (
  3.      <div key='my-fuckkink-ssh-name-input-container-sa-race'>
  4.        <input
  5.          type='text'
  6.          className='form-control'
  7.          onChange={this._onChange}
  8.          value={this.state.value}
  9.        />
  10.      </div>
  11.    )
  12.  }


---------------
trainoo.com, c'est fini
n°2337724
flo850
moi je
Posté le 07-08-2019 à 21:05:02  profilanswer
 

et en simplifiant (perso, j'aime beaucoup les composant fonctionnels et stateless)

Code :
  1. const SshName  = ({value,onChange}) => <div key='my-fuckkink-ssh-name-input-container-sa-race'>
  2.        <input
  3.          type='text'
  4.          className='form-control'
  5.          onChange={onChange}
  6.          value={value}
  7.        />
  8. </div>


Message édité par flo850 le 07-08-2019 à 21:06:14

---------------

n°2337726
nraynaud
lol
Posté le 07-08-2019 à 22:54:11  profilanswer
 

ça marche parfaitement, merci.
 
Je comprends absolument pas la différence, mais c'est pas grave


---------------
trainoo.com, c'est fini
n°2337727
flo850
moi je
Posté le 07-08-2019 à 22:56:08  profilanswer
 

En react , c'est une bonne pratique d'utiliser principalement des composants stateless

 

Surtout quand il commence d'y avoir déjà beaucoup de couches de magie

 

Tu peux peut être même faire péter le div


Message édité par flo850 le 07-08-2019 à 22:57:00

---------------

n°2337733
masklinn
í dag viðrar vel til loftárása
Posté le 08-08-2019 à 06:57:18  profilanswer
 

Ça pourrait être que le setState est async, l’event handler est sync, et il se perd les pieds dans le truc?
 
Si tu reviens au composant stateful et que tu « dispatch » ton événement via le callback du setState il fait quoi?


Message édité par masklinn le 08-08-2019 à 06:58:16

---------------
I've never understood the compulsion to use Web technologies minus the Web's security and deployment models. It seems a bit like throwing the orange away and eating the peel. — @ justinschuh‬
mood
Publicité
Posté le 08-08-2019 à 06:57:18  profilanswer
 

mood
Publicité
Posté le   profilanswer
 

 Page :   1  2  3  4  5  ..  1421  1422  1423  1424  1425  1426
Page Suivante

Aller à :
Ajouter une réponse
 

Sujets relatifs
blabla 3blabla 2
PUTAIN HARKO TU AS FERM2 BLABLA ![Beaucoup de blabla pour rien : post à effacer] Compiler .bat
variable1="blabla + variable2 +blala : c'est possible ??[PHP & regex] "blabla blabla file.ext?point=444 blabla" Recupérer 444
mail("celine@hotmail.com"," sujet","blabla"); pose une err ! Help[MySQL] WHERE 'blabla' compris dans le champ truc
[blabla@prog] Omaha Beach : le topic dédié[PHP / BlaBla - limite]
Plus de sujets relatifs à : blabla@web


Copyright © 1997-2018 Hardware.fr SARL (Signaler un contenu illicite) / Groupe LDLC / Shop HFR