HCWebSDK Vue

HCWebSDK Vue是一个基于Vue框架的海康威视WebSDK的封装库。在使用HCWebSDK Vue之前，需要进行一些准备工作。
首先，需要创建一个store.js文件，引入Vue和Vuex，并创建一个Vuex的Store实例，其中包含了一个名为userInfo的模块。该store.js文件的代码如下：

import Vue from 'vue';
import Vuex from 'vuex';
import userInfo from './userInfo/userInfo.js';

Vue.use(Vuex);

export default new Vuex.Store({
  modules: {
    userInfo
  }
});

第二步是在public目录下的index.html文件中引入jQuery和海康的视频播放webVideoCtrl.js库，代码如下：

<script src="../haikang/jquery-1.7.1.min.js"></script>
<script src="../haikang/webVideoCtrl.js"></script>

最后，在main.js文件中引入store.js并注册到Vue实例中，代码如下：

//引入store.js
import store from './store/store.js';

/* eslint-disable no-new */
new Vue({
  el: '#app',
  router,
  components: { App },
  template: '<App/>',
  //注册一下store
  store
});

这样，你就可以在Vue组件中使用HCWebSDK Vue来进行海康威视WebSDK相关的操作了。<span class="em">1</span><span class="em">2</span><span class="em">3</span>
#### 引用[.reference_title]
- *1* *3* [VUE-CLI项目搭建和常用插件使用](https://blog.csdn.net/qq_43502222/article/details/90107379)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_2"}}] [.reference_item style="max-width: 50%"]
- *2* [海康摄像头设备对接——js接入自己系统的流程方法](https://blog.csdn.net/qq_38854533/article/details/131132710)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_2"}}] [.reference_item style="max-width: 50%"]
[ .reference_list ]