نمایش اطلاعات دریافتی از api در MDBDataTable
سلام
با استفاده از api یه داده ای رو ریختم تو state و پاس دادم به کامپوننت فرزند
class App extends Component{
state={
callReports:[],
}
componentDidMount(){
axios.get('https://jsonplaceholder.ir/posts').then(response=>{
this.setState({callReports:response.data.splice(0,4)})
})
}
render(){
return(
<div>
{
this.state.callReports.map(y=> <Test key={y.id} userId={y.userId} title={y.title} body={y.body}/>)
}
</div>
)
}
}ممنون میشم راهنماییم کنید تو کامپوننت فرزند چجوری اطلاعات رو بیارم تو ستون ها
render(){
let {userId, body, title}= this.props;
const data={
columns: [
{userId:userId,
body:body,
title:title,}
]
}
console.log(data)
return(
<MDBDataTable
striped
bordered
hover
data={???????????????}
/>
)
}
گزینش سوالات
گفت و گو های مرتبط
دسته بندی سوالات
تگ‌های محبوب
شما مجموعه‌ای از اطلاعات رو میگیرید و قرار هست در MDBDataTable نمایش بدید بعد اومدید یه حلقه قرار دادید و و یه کامپونتت داخلش و MDBDataTable رو بردید داخلش ! کی اصلا بهتون گفت این کارو انجام بدید 😐😐
این یک مثال از روش کارکرد هست
import React from 'react';
import { MDBDataTable } from 'mdbreact';
const DatatablePage = () => {
const data = {
columns: [
{
label: 'Name',
field: 'name',
sort: 'asc',
width: 150
},
{
label: 'Position',
field: 'position',
sort: 'asc',
width: 270
}
]
};
return (
<MDBDataTable
striped
bordered
hover
data={data}
/>
);
}
export default DatatablePage;شما داخل درخواست axios اطلاعات رو باس بگیرید داخل data بریزید و فقط به MDBDataTable پاس بدید اون حلقه و کامپونتت فرزند چه کاریه !
سلام
اگر اشتباه نکنم شما باید اول اطلاعات رو از سمت سرور به جیسون برگردونید.
.then(response => response.json())شما مجموعه‌ای از اطلاعات رو میگیرید و قرار هست در MDBDataTable نمایش بدید بعد اومدید یه حلقه قرار دادید و و یه کامپونتت داخلش و MDBDataTable رو بردید داخلش ! کی اصلا بهتون گفت این کارو انجام بدید 😐😐
این یک مثال از روش کارکرد هست
import React from 'react';
import { MDBDataTable } from 'mdbreact';
const DatatablePage = () => {
const data = {
columns: [
{
label: 'Name',
field: 'name',
sort: 'asc',
width: 150
},
{
label: 'Position',
field: 'position',
sort: 'asc',
width: 270
}
]
};
return (
<MDBDataTable
striped
bordered
hover
data={data}
/>
);
}
export default DatatablePage;شما داخل درخواست axios اطلاعات رو باس بگیرید داخل data بریزید و فقط به MDBDataTable پاس بدید اون حلقه و کامپونتت فرزند چه کاریه !