Does anyone have ideas on how preview my url link every time I change the value of url value using vue js

This is what I do but seems not working I want every time I click the button the URL will preview. But seems my code is wrong

  <div class="fb-post" loading="lazy" v-bind:data-href="url" data-width="500" 
  data-show-text="true">
  </div> 
  <q-input v-model="url"/>
  <q-btn @click="urlNew" label="sample"></q-btn>

  <script>
    export default {
     data (){
       return {
         url : 'https://www.facebook.com/MINIAutoStudioCebu/posts/187798053126949',
       },
       methods: {
        urlNew() {
         this.url = 'https://www.facebook.com/sunstarcebu/photos/a.162049727175929/3788412284539637/'
        },
       }
     }
  </script>

64 thoughts on “Does anyone have ideas on how preview my url link every time I change the value of url value using vue js”