راکت

استفاده از jqwidgets component برای react

بدون پاسخ

سلام.خسته نباشید
من دارم برای نشون دادن اطلاعات از کتابخونه jqwidget استفاده میکنم ..همونطور که شما گفتید اطلاعات رو به صورت ajax با axios دریافت میکنم.
برای نمایش این اطلاعات دارم از jqxgrid استفاده میکنم..ولی نمیدونم چطور اطلاعات رو بهش پاس بدم ..هر کاری که کردم اطلاعات داخل grid نمایش داده نمیشه...الان باید جای localdata اطلاعات دریافتی نمایش داده بشه..ممنون میشم راهنماییم کنید..

import React from 'react';
import ReactDOM from 'react-dom';

import JqxGrid, { jqx } from 'jqwidgets-react/react_jqxgrid.js';

class App extends React.Component { 
    render() {       
        let source =
        {
            localdata: [
                ['Alfreds Futterkiste', 'Maria Anders', 'Sales Representative', 'Obere Str. 57', 'Berlin', 'Germany'],
                ['Ana Trujillo Emparedados y helados', 'Ana Trujillo', 'Owner', 'Avda. de la Constitucin 2222', 'Mxico D.F.', 'Mexico'],
                ['Antonio Moreno Taquera', 'Antonio Moreno', 'Owner', 'Mataderos 2312', 'Mxico D.F.', 'Mexico']
            ],
            datafields: [
                { name: 'CompanyName', type: 'string', map: '0' },
                { name: 'ContactName', type: 'string', map: '1' },
                { name: 'Title', type: 'string', map: '2' },
                { name: 'Address', type: 'string', map: '3' },
                { name: 'City', type: 'string', map: '4' },
                { name: 'Country', type: 'string', map: '5' }
            ],
            datatype: 'array'
        };

        let dataAdapter = new jqx.dataAdapter(source);

        let columns =
        [
            { text: 'Company Name', datafield: 'CompanyName', width: 200 },
            { text: 'Contact Name', datafield: 'ContactName', width: 150 },
            { text: 'Contact Title', datafield: 'Title', width: 100 },
            { text: 'Address', datafield: 'Address', width: 100 },
            { text: 'City', datafield: 'City', width: 100 },
            { text: 'Country', datafield: 'Country' }
        ];
        return (
            <JqxGrid ref='myGrid'
                width={850} source={dataAdapter} columns={columns} altstart={1}
            />
        )
    }
}

ReactDOM.render(<App />, document.getElementById('app'));
ثبت پرسش جدید

پاسخ‌ها

0

هنوز پاسخی ثبت نشده

اولین نفری باشید که به این پرسش کمک می‌کند و مسیر حل مشکل را باز می‌کند.

اولین پاسخ را بنویسید

شاید پاسخ شما همین‌جا باشد

برای ارسال پاسخ لازم است وارد شده یا ثبت‌نام کنید

ورود یا ثبت‌نام