TypeScript vuex.mapActions函数代码示例

    function connectToComponent(
      nameOrComponent: string | Component,
      optionalComponent?: Component
    ): Component {
      let Component: Component, name: string
      if (typeof nameOrComponent !== 'string') {
        Component = nameOrComponent
        name = getOptions(Component).name || 'wrapped-anonymous-component'
      } else {
        Component = optionalComponent!
        name = nameOrComponent
      }

      const propKeys = keys(
        stateToProps,
        gettersToProps,
        actionsToProps,
        mutationsToProps,
        methodsToProps
      )

      const eventKeys = keys(
        actionsToEvents,
        mutationsToEvents,
        methodsToEvents
      )

      const containerProps = omit(collectProps(Component), propKeys)
      const containerPropsKeys = Object.keys(containerProps)

      const options = {
        name: `connect-${name}`,
        props: containerProps,
        components: {
          [name]: Component
        },
        computed: merge(mapState(stateToProps), mapGetters(gettersToProps)),
        methods: merge(
          mapActions(merge(actionsToProps, actionsToEvents)),
          mapMutations(merge(mutationsToProps, mutationsToEvents)),
          mapValues(merge(methodsToProps, methodsToEvents), bindStore)
        )
      }

      insertLifecycleMixin(options, lifecycle)
      insertRenderer(
        options,
        name,
        propKeys.concat(containerPropsKeys),
        eventKeys
      )

      if (transform) {
        transform(options, lifecycle)
      }

      return typeof Component === 'function' ? Vue.extend(options) : options
    }

      currentId: null,
      isModify: false
    }
  },

  updated: function(){
    if(!this.currentId && this.apiList.length){
      this.currentId = this.apiList[0]._id
    }
  },

  components:{
    AddApi
  },
  methods: {
    ...mapActions(['remove_apiList', 'modify_apiList']),
    modifyApi(): void {
      this.apiList.map( (item:ITApiListInfo) => {
        if(item._id === this.currentId){
          this.apiName = item.name
          this.apiDesc = item.desc
          this.isModify = true
        }
      })
    },
    ChangeApi(ev): void {
      this.currentId = ev.target.value
    },
    async removeApi(): Promise<any> {
      let { currentId } = this
      if(currentId){

  template: `<div>
              <ul>
                <li v-for="item in routes">
                  <router-link :to="{path: item.path}">{{item.name}}</router-link>
                </li>
              </ul>
            </div>`,
  created: function () {
    this.fetchApiList()
    this.fetchMockList()
    this.fetchFileMockList()
  },
  methods: {
    ...mapActions([
      'updata_apiList',
      'updata_mockList',
      'updata_fileMockList'
    ]),

    // 异步请求apiList
    async fetchApiList(){
      let fetchBack = await FETCH_API_LIST({
        type: 'search'
      })
      this.updata_apiList(fetchBack)
    },
    async fetchMockList(){
      let fetchMockBack = await FETCH_MOCK_LIST({
        type: 'search'
      })
      this.updata_mockList(fetchMockBack)

  },
  components:{},
  mounted: function(){
    this.mockList.map(({_id, desc, name}: ITMockListInfo)=> {
      if(_id === this.mockId) {
        this.desc = desc
        this.name = name
      }
    })
    
    // 请求code
    this.fetchCode()

  },
  methods:{
    ...mapActions(['remove_mockList']),
    async modifMock(){
      let saveState = await FETCH_MOCK_LIST({
        name: this.name,
        type: 'modify',
        pid: this.pid,
        code: this.code,
        desc: this.desc,
        id: this.mockId
      })
      if(saveState.ok === 1){

        // 偷懒
        window.location.reload()
        // this.callback()
      }

                   代码:<textarea v-model="code"></textarea>
                 </label>
               </div>
               <button @click="addCode">新增</button>
             </div>`,
 props:["pid", "pname"],
 data(){
   return {
     desc: '',
     code: ''
   }
 },
 components:{},
 methods:{
   ...mapActions([
     'updata_mockList'
   ]),
   async addCode(){
     if(!this.code && !this.desc){
       return false
     }
     let saveState = await FETCH_MOCK_LIST({
       type: 'save',
       pid: this.pid,
       code: this.code,
       desc: this.desc
     })
     this.updata_mockList(saveState)
     this.desc = ''
     this.code = ''
   }

      'isLoading',
      'isOnline',
      'isDev',
      'constants',
      'errorCode'
    ])
  },
  methods: {
    ...mapActions('global', [
      'calcServerTimeOffset',
      'startLoading',
      'stopLoading',
      'offlineEventListener',
      'onlineEventListener',
      'beforeunloadAlertEventListener',
      'beforeunloadCookieEventListener',
      'windowResizeEventListener',
      'updateTitle',
      'updateErrorCode',
      'openNewTab',
      'moveTo',
      'moveToMypage',
      'reload',
      'closeTab',
      'getCookie',
      'setCookie',
      'removeCookie'
    ])
  }
}

    this.fileMockList

    if (!this.mockId && this.fileMockList.length) {
      this.fileMockList.some((item: any): any => {
        if(item.pid === this.id){
          this.mockId = item.mockId
        }
      })
    }
  },
  components: {
    AddMock,
    EditMock
  },
  methods: {
    ...mapActions([]),
    ChangeMock(ev) {
      this.mockId = ev.target.value
      this.isEdit = false
      FETCH_MOCK_CHANGE({
        type: 'modify',
        pid: this.mockId,
        id: this.id
      })
    },
    clickHandleEdit() {
      this.isEdit = true
    },
    modifyBack() {
      this.isEdit = false
    }

//import { mapGetters, mapActions } from 'vuex'
import { mapActions } from 'vuex'

export default {
  methods: {
    ...mapActions('lessonRoom', ['openNewWindowForPreparation']),
    ...mapActions('modal', ['showModal', 'hideModal'])
  }
}

              </label>
              <br />
              <label>
                接口描述:<textarea v-model="apiDesc"></textarea>
              </label>
              <br />
              <button @click="addApi">新增接口</button>
            </div>`,
  data() {
    return {
      apiName: '',
      apiDesc: ''
    }
  },
  methods: {
    ...mapActions(['updata_apiList']),
    async addApi(): Promise<any> {
      let {
        apiName,
        apiDesc
      } = this

      if (apiName && apiDesc) {
        let addParam: ITFetchApiList = {
          type: 'save',
          name: apiName,
          desc: apiDesc
        }
        let addState = await FETCH_API_LIST(addParam)
        this.updata_apiList(addState)
        this.apiName = ''