| <template> |
| <scroller> |
| <video class="video" onpause="onpause" onstart="onstart" onfinish="onfinish" onfail="onfail" |
| src="http://g.tbcdn.cn/ali-wireless-h5/res/0.0.6/toy.mp4" |
| auto-play="true" play-status="{{playStatus}}"> |
| </video> |
| <div style="flex-direction: row; justify-content: center;"> |
| <wxc-button value="Pause" onclick="{{pause}}"></wxc-button> |
| <wxc-button value="Play" onclick="{{play}}" type="primary" style="margin-left:20px;"></wxc-button> |
| </div> |
| </scroller> |
| </template> |
| |
| <style> |
| .video { |
| width: 750px; |
| height: 460px; |
| margin-bottom: 80px; |
| } |
| </style> |
| |
| <script> |
| require('weex-components'); |
| module.exports = { |
| data: { |
| playStatus: 'play' |
| }, |
| methods: { |
| pause: function() { |
| this.playStatus = 'pause' |
| }, |
| play: function() { |
| this.playStatus = 'play' |
| }, |
| onpause: function(e) { |
| this.$call('modal', 'toast', {'message': 'video pause'}); |
| }, |
| onstart: function(e) { |
| this.$call('modal', 'toast', {'message': 'video start'}); |
| }, |
| onfinish: function(e) { |
| this.$call('modal', 'toast', {'message': 'video finish'}); |
| }, |
| onfail: function(e) { |
| this.$call('modal', 'toast', {'message': 'video fail'}); |
| } |
| } |
| }; |
| </script> |