• 设为首页
  • 点击收藏
  • 手机版
    手机扫一扫访问
    迪恩网络手机版
  • 关注官方公众号
    微信扫一扫关注
    公众号

TypeScript vuex.mapActions函数代码示例

原作者: [db:作者] 来自: [db:来源] 收藏 邀请

本文整理汇总了TypeScript中vuex.mapActions函数的典型用法代码示例。如果您正苦于以下问题:TypeScript mapActions函数的具体用法?TypeScript mapActions怎么用?TypeScript mapActions使用的例子?那么恭喜您, 这里精选的函数代码示例或许可以为您提供帮助。



在下文中一共展示了mapActions函数的9个代码示例,这些例子默认根据受欢迎程度排序。您可以为喜欢或者感觉有用的代码点赞,您的评价将有助于我们的系统推荐出更棒的TypeScript代码示例。

示例1: connectToComponent

    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
    }
开发者ID:ktsn,项目名称:vuex-connect,代码行数:58,代码来源:connect.ts


示例2: function

      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){
开发者ID:jfengsky,项目名称:cquick,代码行数:31,代码来源:Modify.ts


示例3: function

  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)
开发者ID:jfengsky,项目名称:cquick,代码行数:31,代码来源:Menu.ts


示例4: function

  },
  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()
      }
开发者ID:jfengsky,项目名称:cquick,代码行数:31,代码来源:EditMock.ts


示例5: data

                   代码:<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 = ''
   }
开发者ID:jfengsky,项目名称:cquick,代码行数:31,代码来源:AddMock.ts


示例6:

      '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'
    ])
  }
}
开发者ID:tic40,项目名称:archives,代码行数:30,代码来源:global.ts


示例7: ChangeMock

    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
    }
开发者ID:jfengsky,项目名称:cquick,代码行数:31,代码来源:ApiInfo.ts


示例8:

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

export default {
  methods: {
    ...mapActions('lessonRoom', ['openNewWindowForPreparation']),
    ...mapActions('modal', ['showModal', 'hideModal'])
  }
}
开发者ID:tic40,项目名称:archives,代码行数:9,代码来源:modal.ts


示例9: data

              </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 = ''
开发者ID:jfengsky,项目名称:cquick,代码行数:31,代码来源:AddApi.ts



注:本文中的vuex.mapActions函数示例由纯净天空整理自Github/MSDocs等源码及文档管理平台,相关代码片段筛选自各路编程大神贡献的开源项目,源码版权归原作者所有,传播和使用请参考对应项目的License;未经允许,请勿转载。


鲜花

握手

雷人

路过

鸡蛋
该文章已有0人参与评论

请发表评论

全部评论

专题导读
上一篇:
TypeScript vuex.mapState函数代码示例发布时间:2022-05-25
下一篇:
TypeScript vue-svgicon.register函数代码示例发布时间:2022-05-25
热门推荐
热门话题
阅读排行榜

扫描微信二维码

查看手机版网站

随时了解更新最新资讯

139-2527-9053

在线客服(服务时间 9:00~18:00)

在线QQ客服
地址:深圳市南山区西丽大学城创智工业园
电邮:jeky_zhao#qq.com
移动电话:139-2527-9053

Powered by 互联科技 X3.4© 2001-2213 极客世界.|Sitemap