Yêu cầu thg 6 7, 2019 2:06 SA 3062 0 3
  • 3062 0 3
0

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

Chia sẻ
  • 3062 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

thg 6 7, 2019 2:10 SA

Ý 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à 😂

3 CÂU TRẢ LỜI


Đã trả lời thg 6 7, 2019 7:58 SA
+2

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.

Chia sẻ
Avatar ThuongNV @thuongnv
thg 6 7, 2019 10:07 SA

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.

Avatar Nguyen Huy Cuong @cuong_nguyen
thg 6 11, 2019 1:30 SA

@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.

Đã trả lời thg 6 7, 2019 2:11 SA
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

Chia sẻ
Avatar Nguyen Duc @ngduyws
thg 6 7, 2019 2:13 SA

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

Avatar WheeBoo @quanghung97
thg 6 7, 2019 2:20 SA

@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.

Avatar Nguyen Duc @ngduyws
thg 6 7, 2019 2:21 SA

@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?

Avatar WheeBoo @quanghung97
thg 6 7, 2019 2:24 SA

@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ì

Avatar Nguyen Duc @ngduyws
thg 6 7, 2019 2:26 SA

@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?

Avatar WheeBoo @quanghung97
thg 6 7, 2019 2:29 SA

@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ơ.

Avatar Nguyen Duc @ngduyws
thg 6 7, 2019 2:30 SA

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

Đã trả lời thg 6 7, 2019 2:14 SA
0

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

Chia sẻ
Avatar Nguyen Duc @ngduyws
thg 6 7, 2019 2:17 SA

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

Avatar Nguyễn Văn Bách @bachnguyen2907
thg 6 7, 2019 2:21 SA

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

Avatar Nguyen Duc @ngduyws
thg 6 7, 2019 2:28 SA

@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ế đó

thg 6 7, 2019 3:12 SA

@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

Viblo
Hãy đăng ký một tài khoản Viblo để nhận được nhiều bài viết thú vị hơn.
Đăng kí