海康威视web控件开发的正确姿势(2)，通用流行框架大全

// nextTick回调中调用init和clickLogin

this.$nextTick(() => {

this.webVideo.init()

this.webVideo.clickLogin()

})

最终可以看到摄像头画面啦，算是有了成果！

---

有朋友留言说想看一下这个js文件的写法，这里分享一下。有时候不能及时看到评论，见谅

// 初始化插件

export function WebVideo() {

this.g_iWndIndex = 0

this.szDeviceIdentify = ‘’

this.deviceport = ‘’

this.deviceport = ‘’

this.channels = []

this.ip = ‘172.29.3.101’

this.port = ‘80’

this.username = ‘admin’

this.password = ‘123456’

this.init = function() {

var self = this

// 检查插件是否已经安装过

var iRet = WebVideoCtrl.I_CheckPluginInstall();

if (-1 == iRet) {

alert(“您还未安装过插件，双击开发包目录里的WebComponentsKit.exe安装！”);

return;

}

// 初始化插件参数及插入插件

WebVideoCtrl.I_InitPlugin(‘100%’, ‘100%’, {

bWndFull: true,

iPackageType: 2,

iWndowType: 1,

cbInitPluginComplete: function () {

WebVideoCtrl.I_InsertOBJECTPlugin(“divPlugin”);

}

});

}

// 登录

this.clickLogin = function () {

var self = this

if (“” == self.ip || “” == self.port) {

return;

}

self.szDeviceIdentify = self.ip + “_” + self