diff --git a/examples/AsNavFor.js b/examples/AsNavFor.js
index 18cf09847..bebfdc90e 100644
--- a/examples/AsNavFor.js
+++ b/examples/AsNavFor.js
@@ -8,14 +8,14 @@ function AsNavFor() {
   let sliderRef2 = useRef(null);
 
   useEffect(() => {
-    setNav1(sliderRef1);
-    setNav2(sliderRef2);
+    setNav1(sliderRef1.current);
+    setNav2(sliderRef2.current);
   }, []);
   return (
     <div className="slider-container">
       <h2>Slider Syncing (AsNavFor)</h2>
       <h4>First Slider</h4>
-      <Slider asNavFor={nav2} ref={slider => (sliderRef1 = slider)}>
+      <Slider asNavFor={nav2} ref={sliderRef1}>
         <div>
           <h3>1</h3>
         </div>
@@ -38,7 +38,7 @@ function AsNavFor() {
       <h4>Second Slider</h4>
       <Slider
         asNavFor={nav1}
-        ref={slider => (sliderRef2 = slider)}
+        ref={sliderRef2}
         slidesToShow={3}
         swipeToSlide={true}
         focusOnSelect={true}
diff --git a/examples/AutoPlayMethods.js b/examples/AutoPlayMethods.js
index 573c8d5a9..b60b9ba64 100644
--- a/examples/AutoPlayMethods.js
+++ b/examples/AutoPlayMethods.js
@@ -4,10 +4,10 @@ import Slider from "react-slick";
 function AutoPlayMethods() {
   let sliderRef = useRef(null);
   const play = () => {
-    sliderRef.slickPlay();
+    sliderRef.current?.slickPlay();
   };
   const pause = () => {
-    sliderRef.slickPause();
+    sliderRef.current?.slickPause();
   };
 
   const settings = {
@@ -21,7 +21,7 @@ function AutoPlayMethods() {
   return (
     <div className="slider-container">
       <h2>Auto Play {"&"} Pause with buttons</h2>
-      <Slider ref={slider => (sliderRef = slider)} {...settings}>
+      <Slider ref={sliderRef} {...settings}>
         <div>
           <h3>1</h3>
         </div>
diff --git a/examples/PreviousNextMethods.js b/examples/PreviousNextMethods.js
index e0ab6093f..82f0d6a78 100644
--- a/examples/PreviousNextMethods.js
+++ b/examples/PreviousNextMethods.js
@@ -4,10 +4,10 @@ import Slider from "react-slick";
 function PreviousNextMethods() {
   let sliderRef = useRef(null);
   const next = () => {
-    sliderRef.slickNext();
+    sliderRef.current?.slickNext();
   };
   const previous = () => {
-    sliderRef.slickPrev();
+    sliderRef.current?.slickPrev();
   };
   const settings = {
     dots: true,
@@ -18,12 +18,7 @@ function PreviousNextMethods() {
   };
   return (
     <div className="slider-container">
-      <Slider
-        ref={slider => {
-          sliderRef = slider;
-        }}
-        {...settings}
-      >
+      <Slider ref={sliderRef} {...settings}>
         <div key={1}>
           <h3>1</h3>
         </div>
diff --git a/examples/SlickGoTo.js b/examples/SlickGoTo.js
index deeccd7d3..1b45ff139 100644
--- a/examples/SlickGoTo.js
+++ b/examples/SlickGoTo.js
@@ -19,18 +19,13 @@ function SlickGoTo() {
     <div className="slider-container">
       <p>Total updates: {updateCount} </p>
       <input
-        onChange={e => sliderRef.slickGoTo(e.target.value)}
+        onChange={e => sliderRef.current?.slickGoTo(e.target.value)}
         value={slideIndex}
         type="range"
         min={0}
         max={3}
       />
-      <Slider
-        ref={slider => {
-          sliderRef = slider;
-        }}
-        {...settings}
-      >
+      <Slider ref={sliderRef} {...settings}>
         <div>
           <img src={baseUrl + "/abstract01.jpg"} />
         </div>