Saeed_mn
5 سال پیش توسط Saeed_mn مطرح شد
0 پاسخ

استفاده از 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'));

reactjs
تگ‌های محبوب
لاراول
php
laravel
متفرقه
reactjs
عمومی
html_css
nodejs
vuejs
وردپرس
پایتون
css
فلاتر
react
javascript
ثبت پرسش جدید

ثبت اولین پاسخ و دریافت ۵۰ امتیاز

به Saeed_mn کمک کن تا مشکل خودش رو حل کنِ، اینطوری میتونیم باهم پیشرفت کنیم.

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

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