Word count alpine js

<div x-data="{ wordCount: 0 }" x-init="wordCount = $el.querySelector('textarea').value.trim().split(' ').length;">
  
  <textarea class="form-input border" rows=5 @keyup="wordCount = $event.target.value.trim().split(' ').length;"></textarea>
       
  <p class="text-xs" :class="wordCount < 20 ? 'text-red-700' : 'text-green-700'">Word counts: <span x-html="wordCount"></span> min: 20</p>
</div>

Source: codepen.io

Similar codes

4 votes170 views1 answer
NavBar Bootstrap v4 Fix
Html
-1 vote176 views1 answer
How to add Music to body html
Html
2 votes194 views1 answer
Publish html website
Html
3 votes178 views1 answer
Python parse html
Html
0 vote200 views1 answer
Was not loaded because its mime type, “text/html”, is not “text/css”. react
Html
1 vote200 views1 answer
Codewithmarley
Html
4 votes194 views3 answers
Composer new laravel
Html
1 vote145 views1 answer
Font family sans-serif set
Html
1 vote185 views2 answers
Float middle
Html
0 vote198 views1 answer
Acept img html
Html