مرجع مقالات کاربردی طراحی اپلیکیشن

شرح کامل مقالات طراحی اپلیکیشن

مرجع مقالات کاربردی طراحی اپلیکیشن

شرح کامل مقالات طراحی اپلیکیشن

شرح کامل مقالات طراحی اپلیکیشن

  • ۰
  • ۰

همان طور که می‌توانید ببینید ما یک ارور ر state در نرم افزار داریم، طراحی اپلیکیشن در مشهد ما همینطور توابعی داریم تا مقادیر ارورها را تغییر تحول دهیم و یا این که آن را reset کنیم. ما مقدار را ارسال می‌کنیم و تابع ریست آن را ریست می نماید. اذن دهید ببینیم چه‌گونه GlobalErr شغل می نماید:

import React, { Component } from \'react\'

class GlobalError extends Component {
render() {
if (!this.props.error) return null

return (
style={{
position: \'fixed\',
top: 0,
left: \'50%\',
transform: \'translateX(-50%)\',
padding: 10,
backgroundColor: \'#ffcccc\',
boxShadow: \'0 3px 25px -10px rgba(0,0,0,0.5)\',
display: \'flex\',
alignItems: \'center\',
}}
>
{this.props.error}
 
className=\"material-icons\"
style={{ cursor: \'pointer\' }}
onClick={this.props.resetError}
>
close


)
}
}

export default GlobalError
export default GlobalError

همان طور که میتوانید در خط پنج ملاحظه کنید در شرایطی‌که هیچ یک از ارورهای جاوا اسکریپت صورت ندهد ما هیچ چیزی را رندر نمیکنیم، این عمل سبب ساز می‌گردد که ما نوارهای قرمز‌رنگ خالی نداشته باشیم. دقت داشته باشید که شما میتوانید کارکرد این کامپوننت را تغییر و تحول دهید، از جمله شما می‌توانید ‘x’ را با ارور timeout بده بستان نمائید که موقعیت ارورهای جاوا اسکریپت را بعداز سپری شد برهه زمانی هنگامی تغییر و تحول دهد. هم اکنون شما می‌توانید هر جایی که خواستید از این global error state به کار گیری فرمایید، برای این شغل صرفا کافی میباشد _setError را از Application.js منتقل فرمایید و آن گاه میتوانید global error را تهیه و تنظیم فرمائید.

یک نمونه دیگر

import React, { Component } from \'react\'
import axios from \'axios\'

class GenericErrorReq extends Component {
constructor(props) {
super(props)

this._callBackend = this._callBackend.bind(this)
}

render() {
return (

Click me to call the backend

)
}

_callBackend() {
axios
.post(\'/api/city\')
.then(result => {
// do something with it, if the request is successful
})
.catch(err => {
if (err.response.data.error === \'GENERIC\') {
this.props.setError(err.response.data.description)
}
})
}
}

export default GenericErrorReq

  • ۰۱/۰۵/۰۳
  • شایلین عباسی

طراحی اپلیکیشن در مشهد

نظرات (۰)

هیچ نظری هنوز ثبت نشده است

ارسال نظر

ارسال نظر آزاد است، اما اگر قبلا در بیان ثبت نام کرده اید می توانید ابتدا وارد شوید.
شما میتوانید از این تگهای html استفاده کنید:
<b> یا <strong>، <em> یا <i>، <u>، <strike> یا <s>، <sup>، <sub>، <blockquote>، <code>، <pre>، <hr>، <br>، <p>، <a href="" title="">، <span style="">، <div align="">
تجدید کد امنیتی