Asked Jun 7th, 2:06 AM 131 0 3
  • 131 0 3
0

Thêm js 'thường' vào reactjs

Share
  • 131 0 3

Chào mọi người, mình mới học reactjs, mình không biết cách thêm js (js thuần, như khi làm html css và thêm js xử lý animate ấy) vào như nào

Ví dụ bạn làm 1 trang html cơ bản và thêm file main.js gồm các hàm xử lý các sự kiện click, scroll... làm đẹp web ấy, thì thêm file đó vào react như nào, vì react nó là DOM ảo, còn js thường hay jquery nó tương tác với DOM thật

Jun 7th, 2:10 AM

Ý bạn là viết js thuần, sử dụng các phương thức getElementById(), querySelector()... để get các element không có trong component? nó vẫn là js nên bạn thích viết như nào cũng đc mà 😂

0
| Reply
Share

3 ANSWERS


Answered Jun 7th, 7:58 AM
+1

chuyển từ jquery sang React đòi hỏi bạn đổi hoàn toàn mindset, bạn chắc mới học React thì mình khuyên bạn hãy quên jquery và chỉ quan tâm đến state, props và component, vào docs React, phần main concept cày hết ví dụ trong đó trước.

Share
ThuongNV @thuongnv
Jun 7th, 10:07 AM

Hi @cuong_nguyen , Bạn cho mình hỏi nếu html có nhiều thư viện js như slide. Mà thư viện slide đó dùng jQuery, thì nếu bạn bỏ jQuery đi thì bạn phải viết lại slide đó ah? Note: React không có component slide này nhé. Trên đó là mình mới vd slide thôi. Còn rất nhiều cái khác dùng jQuery nữa.

0
| Reply
Share
Nguyen Huy Cuong @cuong_nguyen
Jun 11th, 1:30 AM

@thuongnv chắc bạn bị quen với jquery và ngại thay đổi, hoặc chắc bạn chưa nghiên cứu React đủ lâu để nhận ra chẳng có gì react không làm được cả, jquery hay react thì đều là thư viện Javascript mà thôi, 1 task làm được bằng JS thì đều làm được với 2 công cụ trên. Chuyển sang react mà cứ nấn ná jquery thì tốt nhất cứ ở lại với jquery nhé bạn.

0
| Reply
Share
Answered Jun 7th, 2:11 AM
0

ReactJs là thư viện javascript, bản chất component trong đó đều là Js, vậy không rõ câu hỏi của bạn ý là gì ? harold.jpg

Share
Nguyen Duc @ngduyws
Jun 7th, 2:13 AM

ý mình là js thuần xử lý animte cho giao diện thêm đẹp ấy

0
| Reply
Share
Jun 7th, 2:20 AM

@ngduyws à thế tức là thế này. Bên trong reactjs đã có các phương thức sẵn có để xử lý DOM cấu trúc HTML, xử lý animate kết hợp các state của component đó theo các event. Reactjs sinh ra để giải quyết các component giao tiếp qua lại, khắc phục sự rối loạn của javascript thuần khi scale dự án và bất đồng bộ của ngôn ngữ dễ sai nhất thế giới.

0
| Reply
Share
Nguyen Duc @ngduyws
Jun 7th, 2:21 AM

@quanghung97 vậy tức là dự án thật thì react sẽ ko sử dụng jquery hay js làm animate mà nó sẽ có riêng các thư viện gì đó khác à b?

0
| Reply
Share
Jun 7th, 2:24 AM

@ngduyws dùng chung thì vẫn dùng được nhưng loạn lên hết thư viện này đè thư viện khác, rối cực kì

0
| Reply
Share
Nguyen Duc @ngduyws
Jun 7th, 2:26 AM

@quanghung97 vậy ví dụ bình thường chỉ làm html css js thuần, click vào nút A và nút A đổi màu, trong react thì mình sẽ onClick thì thêm class active chẳng hạn vào nút A, và css cho class active màu khác à b?

0
| Reply
Share
Jun 7th, 2:29 AM

@ngduyws uk đúng thế rồi còn j. Còn có cả life cycle hook nữa bạn để quản lý nữa cơ.

0
| Reply
Share
Nguyen Duc @ngduyws
Jun 7th, 2:30 AM

@quanghung97 ừ cám ơn bạn nhé 👍

0
| Reply
Share
Answered Jun 7th, 2:14 AM
0

bạn học JSX và ES6 đi, hỏi khó hiểu quá

Share
Nguyen Duc @ngduyws
Jun 7th, 2:17 AM

khi b làm 1 trang html, bạn thêm js để tạo hiệu ứng khi click, khi scroll chẳng hạn, ý mình là cái js đó ấy, bình thường thì gộp nó thành 1 file main.js rồi thêm vào html, nhưng react thì thêm js đó kiểu gì ấy

0
| Reply
Share
Nguyễn Văn Bách @bachnguyen2907
Jun 7th, 2:21 AM

@ngduyws ý bạn là import file trong React ??

0
| Reply
Share
Nguyen Duc @ngduyws
Jun 7th, 2:28 AM

@bachnguyen2907 ví dụ b làm html css js thuần, cái file js thuần đó b để xử lý các sự kiện, làm animate cho web, thì trong react cái đống js kia thêm như nào ấy, react là dom ảo còn js kia là tương tác với dom thật, ý mình là thế đó

0
| Reply
Share
Jun 7th, 3:12 AM

@ngduyws thì dùng Ref, import code js bên thứ 3(code của bạn trước đó: jquery hay gì gì đó) vào, để phần code này xử lý phần dom đó, reactjs không can thiệp phần dom đó nữa là được. Mọi thứ hoạt động ổn, nếu cần tìm hiểu thêm https://reactjs.org/docs/integrating-with-other-libraries.html#integrating-with-jquery-chosen-plugin

0
| Reply
Share