masyarakat Belajar Perpustakaan Alatan Masa lapang
cari
Melayu
javascript - teg video vue 2.0, url diperoleh melalui ajax, dan video yang dipautkan menggunakan v-bind:src="" tidak boleh dimainkan
迷茫
迷茫 2017-06-12 09:31:32
0
2
1397
Teg video

vue 2.0, gunakan v-bind:src="" untuk memautkan url video dan url diperoleh daripada ajax dalam pangkalan data selepas halaman tersebut dimuatkan, tetapi video tidak boleh dimainkan.

rangkaian tidak memaut untuk memuatkan video ini.

Halaman ini berjaya dipaparkan. Hanya masukkan kod berikut ke dalam fail html biasa dan ia akan dimainkan dengan jayanya. 

<video controls="controls" poster="http://sdkadmin.91sd.com/data/slide/1496305029.jpg"><source type="video/mp4" src="http://img-cdn.wanyouxi.com/video/20170601_mdzz_recommend_video.mp4"> <source type="video/ogg" src="http://img-cdn.wanyouxi.com/video/20170601_mdzz_recommend_video.mp4"> <source type="video/webm" src="http://img-cdn.wanyouxi.com/video/20170601_mdzz_recommend_video.mp4"> <object data="http://img-cdn.wanyouxi.com/video/20170601_mdzz_recommend_video.mp4"><embed src="http://img-cdn.wanyouxi.com/video/20170601_mdzz_recommend_video.mp4"></object> <p>很抱歉！您的浏览器不支持视频控件请更新版本/使用uc浏览器等</p></video>

Kod sumber: 

                <video controls="controls" :poster="recommendVideo.thumb_img" @click="cancelBubble()">
                    <source :src="recommendVideo.outside_url" type="video/mp4">
                    <source  :src="recommendVideo.outside_url" type="video/ogg">
                    <source  :src="recommendVideo.outside_url" type="video/webm">
                    <object :data="recommendVideo.outside_url" >
                        <embed  :src="recommendVideo.outside_url" />
                    </object>
                    <p>很抱歉！您的浏览器不支持视频控件请更新版本/使用uc浏览器等</p>
                </video>

Projek ini ditulis dalam vue 1.0+ sebelum ini, ia telah dinaik taraf kepada vue 2.0 kerana pembinaan semula Sebelum ini, vue 2.0 menggunakan {{}} untuk mengalih keluar kaedah pengikatan ini muncul soalan, sila minta Tuhan menjawabnya.

Sebab untuk ujian peribadi ialah url tidak boleh dimainkan secara normal kerana ajax mengembalikannya Jika nilai atribut objek recommentVideo ditetapkan dalam data, ia boleh dimainkan, tetapi jika ajax memperoleh data dan kemudian memberikannya, ia. tidak boleh dimainkan.

迷茫
迷茫

业精于勤，荒于嬉;行成于思，毁于随。

membalas semua(2)
習慣沉默
習慣沉默2017-06-12 09:33:32 Tingkat 2

Baiklah, kawan, lihat, kelajuan rangkaian agak perlahan, lebih baik saya memberi anda tangkapan skrin
Sudah tentu, mungkin juga anda tidak mencetuskan perubahan paparan vue selepas mendapat url.

Ini adalah kod tambahan, sebab yang sama

<!doctype html>
<html lang="en">
<head>
  <meta charset="UTF-8" />
  <title>Document</title>
  <script src="https://cdn.bootcss.com/vue/2.3.3/vue.js"></script>
 </head>
<body>
  <p id="main">
    <video controls="controls" :src="url">
      <source :src="url" type="video/mp4">
    </video>
  </p>
  <script>  
      var app = new Vue({
        el: "#main",
        data: {
          url: ''
        },
        methods: {
          // 模拟ajax
          loadUrl: function(){
            var _this = this;
            setTimeout(function(){
               _this.url = 'http://img-cdn.wanyouxi.com/video/20170601_mdzz_recommend_video.mp4';
            },5000);
          }
        }
      })
      console.log(app);
      app.loadUrl();
  </script>
</body>
</html>
Suka +0
Tambah Balasan
阿神
阿神2017-06-12 09:33:32 Tingkat 1

Mungkin kod permulaan anda sudah sedia, vue2's ready dipanggil mounted

Suka +0
Tambah Balasan
Topik popular
Lagi>
Artikel popular
Tutorial Popular
Lagi>
Tutorial berkaitan
Cadangan popular
Kursus terkini
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan