Visualizzazione dei risultati da 1 a 3 su 3
  1. #1

    [React] Material table e lookup dinamico

    ci provo, magari a qualcuno viene un'idea.

    devo impostare il lookup di una material table in maniera dinamica.
    quindi, alla fine, prenderli da remoto.

    quindi step by step.

    esempio funzionante:
    codice:
    const r = {12: 'cesare pavese', 124: 'david mccomb', 3: 'stephen king'};
    const [state, setState] = React.useState({
        columns: [
            {field: 'id', title: 'ID', editable: 'never'},
            {field: 'title', title: 'Titolo'},
            {
                field: 'author_id',
                title: 'Autore',
    lookup: {r}
            },
            {field: 'editor', title: 'Editore'},
            {field: 'price', title: 'Prezzo', type: 'numeric'},
            {field: 'isbn', title: 'ISBN'},
            {field: 'note', title: 'Note'}
        ]
    });
    esempio non funzionante:
    codice:
    const r = "12: 'cesare pavese', 124: 'david mccomb', 3: 'stephen king'";
    const [state, setState] = React.useState({
        columns: [
            {field: 'id', title: 'ID', editable: 'never'},
            {field: 'title', title: 'Titolo'},
            {
                field: 'author_id',
                title: 'Autore',
    lookup: r
            },
            {field: 'editor', title: 'Editore'},
            {field: 'price', title: 'Prezzo', type: 'numeric'},
            {field: 'isbn', title: 'ISBN'},
            {field: 'note', title: 'Note'}
        ]
    });
    quindi il formato stringa non funziona, ma non da errori.

    a questo punto ho provato così:
    codice:
    const [authors, setAuthors] = useState([]);
    const [state, setState] = React.useState({
        columns: [
            {field: 'id', title: 'ID', editable: 'never'},
            {field: 'title', title: 'Titolo'},
            {
                field: 'author_id',
                title: 'Autore',
                lookup: authors
    },
            {field: 'editor', title: 'Editore'},
            {field: 'price', title: 'Prezzo', type: 'numeric'},
            {field: 'isbn', title: 'ISBN'},
            {field: 'note', title: 'Note'}
        ]
    });
    
    useEffect(() => {
        const r = {12: 'cesare pavese', 124: 'david mccomb', 3: 'stephen king'};
        setAuthors(r);
    }, []);
    questo in teoria dovrebbe funzionare, ma invece mi da errore:
    codice:
    Warning: Failed prop type: Invalid prop `columns[2].lookup` of type `array` supplied to `MaterialTable`, expected `object`.     in MaterialTable     in Unknown (created by WithStyles(Component))     in WithStyles(Component) (at home.js:55)     in div (at home.js:54)     in Home (at App.js:15)     in div (created by ForwardRef(Container))     in ForwardRef(Container) (created by WithStyles(ForwardRef(Container)))     in WithStyles(ForwardRef(Container)) (at App.js:13)     in App (at src/index.js:8)
    errore che non capisco.
    a qualcuno viene un'idea??

  2. #2
    allora, prendendo in considerazione il primo esempio...

    ho cambiato così:
    codice:
    const [authors, setAuthors] = useState();
    const [state, setState] = React.useState({
        columns: [
            {field: 'id', title: 'ID', editable: 'never'},
            {field: 'title', title: 'Titolo'},
            {
                field: 'author_id',
                title: 'Autore',
                lookup: authors
    },
            {field: 'editor', title: 'Editore'},
            {field: 'price', title: 'Prezzo', type: 'numeric'},
            {field: 'isbn', title: 'ISBN'},
            {field: 'note', title: 'Note'}
        ]
    });
    
    useEffect(() => {
    
        async function getAuthors() {
            const result = await axios.get(AUTHORS_ALL);
            return result;
        }
    
        getAuthors().then(res => {
    setAuthors(res.data);
        });
    
    }, []);
    in pratica ho modificato il default nello useState().
    adesso però visualizzo il campo numerico e non il nome (invece nel primo esempio vedevo tutto corretto).
    il formato è lo stesso ovviamente.

  3. #3
    no scusate, non considerate il posto sopra.

    in pratica penso che il problema sia la valorizzazione nello useEffect.
    quando valorizzo authors li, non funziona.
    se lo faccio fuori (statico ovviamente) funziona.

Permessi di invio

  • Non puoi inserire discussioni
  • Non puoi inserire repliche
  • Non puoi inserire allegati
  • Non puoi modificare i tuoi messaggi
  •  
Powered by vBulletin® Version 4.2.1
Copyright © 2019 vBulletin Solutions, Inc. All rights reserved.