title: Alpine JS - VM11705:16 Uncaught TypeError: Cannot read properties of undefined (reading 'title') Error Issue
body: <p>I made a widget using alpine js however, getting an error like and finding solution to my research. What do you think is the error in my code? When I pull the data, the header part is said to be incorrect. But I can't see a problem. Or I couldn't figure it out.</p>
  <p>[Errors i see in console][1]
  [1]: https://i.stack.imgur.com/ofmW1.png</p>
  <pre><code>&lt;div class=&quot;text-base w-56 px-5 rounded-full overflow-hidden&quot; x-data=&quot;{
                     textArray: [],
                  text: '',
                  textIndex: 0,
                  charIndex: 0,
                  pauseEnd: 2750,
                  cursorSpeed: 420,
                  pauseStart: 20,
                  typeSpeed: 50,
                  direction: 'forward'
               }&quot; x-init=&quot;(() =&gt; {
  
                  fetch('/wp-json/wp/v2/pages/219/?_fields=acf.positions&amp;acf_format=standard')
                    .then(response =&gt; response.json())
                    .then(data =&gt; textArray = data.acf.positions  );
  
  
  
                  let typingInterval = setInterval(startTyping, $data.typeSpeed);
  
  
  
               function startTyping(){
                  let current = $data.textArray[$data.textIndex].title;
                  if($data.charIndex &gt; current.length){
                       $data.direction = 'backward';
                       clearInterval(typingInterval);
                       setTimeout(function(){
                          typingInterval = setInterval(startTyping, $data.typeSpeed);
                       }, $data.pauseEnd);
                  }
  
                  $data.text = current.substring(0, $data.charIndex);
                  if($data.direction == 'forward'){
                      $data.charIndex += 1;
                   } else {
                      if($data.charIndex == 0){
                          $data.direction = 'forward';
                          clearInterval(typingInterval);
                          setTimeout(function(){
  
                              $data.textIndex += 1;
                              if($data.textIndex &gt;= $data.textArray.length){
                                  $data.textIndex = 0;
                              }
  
                              typingInterval = setInterval(startTyping, $data.typeSpeed);
                          }, $data.pauseStart);
                      }
                      $data.charIndex -= 1;
                   }
  
               }
  
               setInterval(function(){
                  if($refs.cursor.classList.contains('hidden')){
                      $refs.cursor.classList.remove('hidden');
                  } else {
                      $refs.cursor.classList.add('hidden');
                  }
               }, $data.cursorSpeed);
           })()&quot;&gt;
  
  
              &lt;span x-text=&quot;text&quot;&gt;&lt;/span&gt;
              &lt;span class=&quot;opacity-70&quot; x-ref=&quot;cursor&quot;&gt;|&lt;/span&gt;
          &lt;/div&gt;
  </code></pre>
  <p>Thanks in advance for your suggestions and help.</p>