Agentassistant NPM

介绍

该插件为华云天下所有

使用介绍

NPM

  npm i agentassistant --save

下一步

  import A from "agentassistant"
  const editor = new A("div1")

CDN

   <script
     type="text/javascript"
     src="./dist/gyp.min.js"
   ></script>
   <script type="text/javascript">
     const E = window.ServiceAssistant
			    new E('testNpm')
   </script>

项目中使用svg图标

  const userIcon = new SvgIcon('user').elem // user为你的icons/svg中的svg名称
   const titleDiv = createMutilElement(`
   ${userIcon}
   <span>林晓非/021-5223648</span>
   <div class="hah-middle-time">
     <div class="hah-hmt-text">
       <span>聊天中</span>
     </div>
     <div class="vertical"></div>
     <div class="hah-hmt-time">00:00:35</div>
   </div>
   <div class="hah-opera-box">加图标</div>
 `)

项目中数据交互

例子：

  fillHeader() {
    const titleDiv = createMutilElement(this.render(), this.methods())
    return titleDiv
  }
  render() {
    const userIcon = new SvgIcon('user').elem
    return `
      <div class="huayun-agent-header">
        <span>${userIcon}</span>
        <span>林晓非/021-5223648</span>
        <div class="hah-middle-time">
          <div class="hah-hmt-text">
            <span>聊天中</span>
          </div>
          <div class="vertical"></div>
          <div class="hah-hmt-time" onmouseover="over()">00:00:35</div>
        </div>
        <div class="hah-opera-box" onclick="add()">加图标</div>
      </div>
    `
  }
  // 注意使用箭头函数
  methods() {
    return {
      add: () => {
        alert('kkkk')
      },
      over: () => {
        alert('over')
      }
    }
  }