Agenthelper NPM

介绍

该插件为HY所有

使用介绍

NPM

  npm i agentassistant --save

下一步

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

CDN

   <script
     type="text/javascript"
     src="./dist/agenthelper.min.js"
   ></script>
   <script type="text/javascript">
     <!-- const E = window.ServiceAssistant
			    new E('testNpm') -->
     let agentHelper = new ServiceAssistant(mainId, agentParam);
   </script>

项目中使用svg图标

 render() {
   const userIcon = new SvgIcon('user').elem // user为你的icons/svg中的svg名称
   return `
     <div class='center-bottm'>
       ${userIcon}
     </div>
   `
 }

父子组件传值的方式

父传子
第一种方式：在注册子组件的地方，将需要传递的数据也绑定好
           components () {
             return { 
               Header:{
                 comp: Header, // 导入的组件
                 props: {
                   test: [1, 2, 3]
                 }
               }
             }
           }
第二种方式：在render中，写组件的时候加上属性的方式  类似 <Header tetes="${JSON.stringify([1, 2, 3])}" />

后面防止props被修改，所以需要把父组件传给子组件的值，进行保护
保护的方式：
   一种是利用object.defineProperty()
   另一种是设置闭包
     //设置一个闭包，把变量保护起来，通过返回值调用
     function createStore() {
       let appState={
         fontSize:'26px',
         title:{
           text:'标题',
           color:'red'
         },
         content:{
           text:'类容',
           color:'green'
         }
       }
       //保护变量被修改，深克隆
       let getState=()=>JSON.parse(JSON.stringify(appState));
       //改变变量的方法
       let dispatch=(action)=>{
         switch(action.type){
           case CHANGE_FONT_SILE:
             appState.fontSize=action.fontSize;
           default:
             return;
         }
       }
       //返回出去的修改和取值的接口
       return{
         getState,
         dispatch
       }
     }
子传父
  方法一： 依赖nodejs EventEmitter实现
  方法二：采用与vue 中$emit 和 $on 的实现方式  发布订阅者模式

关于框架的使用要点

render()中传参，需要使用{{}}包裹，并且若是Object类型，需要JSON.stringify()包裹转为字符串，例子：
```
  <p HG_click="titleSelect({{${JSON.stringify(item)}}}, {{${index}}})">
```

包裹再this.data中的数据，为响应式的数据，也就是修改data中的数据，页面会重新渲染 注意事项： 只有 this.data 中引用类型可以使用解构赋值的方式定义，其他普通类型的数据不能使用结构赋值出来使用例子：

  titleSelect (_event, val, index) {
     const { intent } = this.data // intent是一个数组 引用类型 所以可以使用解构赋值定义的方式
     this.data.titleProblem = val.problem  // titleProblem 和 detailContent是字符串，基本类型，不要使用解构赋值的定义方式
     this.data.detatilContent = val.content
     intent[index].isActive = !intent[index].isActive
  }

待解决的问题

当该插件在带有iconfont图标的vue项目中使用, svg图标引入有问题，不会在body下面创建symbol 已解决

@babel/polyfill i18n jquery jquery-i18n-properties

@everything-registry/sub-chunk-1105

10 months ago

10 months ago

11 months ago

11 months ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

3 years ago

3 years ago

3 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

3 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

3 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

3 years ago

4 years ago

3 years ago

4 years ago

4 years ago

4 years ago

3 years ago

3 years ago

3 years ago

4 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

4 years ago

4 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

4 years ago

4 years ago

4 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago