第七色在线视频,2021少妇久久久久久久久久,亚洲欧洲精品成人久久av18,亚洲国产精品特色大片观看完整版,孙宇晨将参加特朗普的晚宴

為了賬號安全,請及時綁定郵箱和手機(jī)立即綁定
已解決430363個問題,去搜搜看,總會有你想問的

react 和 angular 之間的共享服務(wù)

react 和 angular 之間的共享服務(wù)

一只斗牛犬 2022-06-09 19:22:44
在我的公司,我們有 3 個應(yīng)用程序,1 個 ng8、1 個 vue 和一個新的 react。我正在尋找一種編寫共享核心庫的方法,以將我們的公共服務(wù)(登錄、身份驗證、存儲等)放在那里,這些服務(wù)是常見的并且與 DOM 無關(guān)(主要是對我們 API 的 HTTP 調(diào)用)。它目前是用 Angular 編寫的,并且喜歡內(nèi)置的 DI,因為它們相互使用。這個想法是用 vanilla javascript 編寫它以允許所有框架使用它。更新:當(dāng)前簡化的角度實(shí)現(xiàn)://file: auth.service.ts:export class AuthService {    setCred(uname: string, token: string) {    }    getCred() {    }}//file: login.service.ts:import { AuthService } from './auth.service';export class LoginService {    constructor(private http: HttpClient, private authService: AuthService) {    }    login(email: string, pass: string): Observable {        return this.http.post('/login', {email, pass}).subscribe(response => {            this.authService.setCred(response.uname, response.token);        }    }}}我希望能夠像這樣在 Angular 應(yīng)用程序中使用這兩種服務(wù):@Injectable({  providedIn: 'root'})export class FeatureService {  constructor(    private httpClient: HttpClient,    private authService: AuthService,    private userService: UserService  ) {    console.log('feature service init', authService.getCred());  }}這種要求有已知的方法嗎?我仍然想在圖書館里促進(jìn) DI。我將如何以角度使用此類服務(wù)?我需要將它們包裝在 Angular 服務(wù)中嗎?
查看完整描述

2 回答

?
藍(lán)山帝景

TA貢獻(xiàn)1843條經(jīng)驗 獲得超7個贊

我會將你所有的 API 調(diào)用移動到可以導(dǎo)入到你的 React、Vue 和 Angular 應(yīng)用程序中的模塊中。您可以使用NPM 上fetch的許多其他模塊之一。HttpClient


從 Angular 的角度來看,這樣做是有弊端的。Angular 希望您使用該HttpClient模塊,因此如果您放棄該模塊并使用共享模塊,您將失去很多這些功能。因此,如果您需要HttpInterceptor設(shè)置,則必須創(chuàng)建自己的而不是使用 Angulars,因為您沒有使用它們的HttpClient. 我對 React 或 Vue 的使用還不夠多,不知道它們是否也有自己的HttpClient模塊。


使用基本服務(wù)的示例fetch


class TodoService {

  constructor() {}

  static getTodo(id) {

    return new Promise( (resolve, reject) => {

      fetch(`https://jsonplaceholder.typicode.com/todos/${id}`).then(r => resolve( r.json() ) );

    });

  }

  // ...

}


TodoService.getTodo(1).then(t => console.log(t) );

一旦你弄清楚你想要在你的模塊中做什么,那么你就可以在任何你需要的地方export提供服務(wù)。import請記住,如果您將依賴項引入模塊,則必須打包模塊,以便您的依賴項隨模塊一起提供。



查看完整回答
反對 回復(fù) 2022-06-09
?
蕪湖不蕪

TA貢獻(xiàn)1796條經(jīng)驗 獲得超7個贊

在這種情況下,您的服務(wù)應(yīng)該與框架/庫無關(guān)。正如您所描述的那樣,它就像是另一個被分成域的層??赡軙?chuàng)建一個存儲庫來存儲此項目和。這些應(yīng)用程序可以使用 NPM 安裝它。



查看完整回答
反對 回復(fù) 2022-06-09
  • 2 回答
  • 0 關(guān)注
  • 224 瀏覽
慕課專欄
更多

添加回答

舉報

0/150
提交
取消
微信客服

購課補(bǔ)貼
聯(lián)系客服咨詢優(yōu)惠詳情

幫助反饋 APP下載

慕課網(wǎng)APP
您的移動學(xué)習(xí)伙伴

公眾號

掃描二維碼
關(guān)注慕課網(wǎng)微信公眾號