Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

我的学习日志(三) #4

Open
1 task done
xxxgitone opened this issue Jun 1, 2017 · 0 comments
Open
1 task done

我的学习日志(三) #4

xxxgitone opened this issue Jun 1, 2017 · 0 comments

Comments

@xxxgitone
Copy link
Owner

这几天天天考试,复习,所以每天减少了很多编码时间

今天完成任务很少

  • vnpastime项目视频播放器的编写(播放器弄了几天了,今天终于收尾了)

知识点

1. vue.js的class绑定

在用vue.js写代码的时候,经常会遇到,选中一个项,然后给它增加高亮样式。以往我都是给这个项增加一个selected字段来标识它是否被选中,然后通过vue的class绑定机制给渲染上去,但是发现这种增加字段的方式并不好,每次都得修改数据。

下面是另一种方式,今天在写代码的时候的一个例子,选择视频清晰度

     <span v-for="src in videosrc" :class="{ select: selectedSrc === src.name }" >
          {{ src.name }}
     </span> 

数据

     videosrc: [
          { name: '标清', url: 'xxxxxxxxx'} ,
          { name: '高清', url: 'xxxxxxxxx'} ,
          selectedSrc: ''
     ]

机制都是一样,不过后面这种是用语句的形式进行判断true还是false,但是显得更加灵活,反正对自己来说,是学到了,点点滴滴还得积累,细节还有思维确实非常重要。

2. video方法常用方法

    ontimeupdate  //视频时间每次改变都会执行,适合改变颜色进度条的长度
    onended   // 视频结束出发,我用来显示重播按钮

还有一些方法和属性,等以后写篇博文,记录

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant