vue新任务

为什么80%的码农都做不了架构师？>>>   

vue组件传值

https://blog.csdn.net/mr_fzz/article/details/54636833

emit是触发，on是绑定

mounted () {
  Bus.$on('tabClick2', ()=> {
      if (this.$route.name == 'shopManage') {
        this.$axios.get(`${this.$api}/b/sysconfig?type_name=district&pid=0`)
            .then(res => {
                this.options1 = res.data.data
            })
        this.$axios.get(`${this.$api}/b/baseinfo/create`)
            .then(res => {
                if (res.data.data.shops.id) {
                    var data = res.data.data.shops
                    this.shop_id = data.id
                    //  this.business_circle = data.business_circle
                    this.introduction = data.introduction
                    this.address_detail = data.address
                    this.province = data.province_id * 1 ? data.province_id * 1 : ''
                    this.city = data.city_id * 1 ? data.city_id * 1 : ''
                    this.town = data.district_id * 1 ? data.district_id * 1 : ''
                    this.slogan = data.slogan         
                    this.business_circle = data.business_circle   
                    this.lng = data.longitude
                    this.lat = data.latitude
                    this.marker = [data.longitude, data.latitude]
                }

                this.options1 = res.data.data.province
                this.options2 = res.data.data.city
                this.options3 = res.data.data.district             
            })             
      }
  })
},
destroyed () {
  Bus.$off('tabClick2')
},

 

config.js文件放置配置的东西

const config = {
  staticHash: false,
  staticUrl: './',
  request: '/api',
  api: 'http://x.diandanme.com',
  socketApi: 'http://ws.diandanme.com',
  debug: true
  // debug: false
}

module.exports = config

引入使用

Vue.prototype.$api = require('./config').request

父组件与子组件通信

父组件写法：

<parent>

<child :child-msg="msg"></child>//这里必须要用 - 代替驼峰

</parent>

data(){ return { msg: [1,2,3] }; }

子组件部分写法：

 方法一、props: ['childMsg']

 方法二、props: { childMsg: Array //这样可以指定传入的类型，如果类型不对，会警告 }

 方法三：props: { childMsg: { type: Array, default: [0,0,0] //这样可以指定默认的值 } }

<foot-view leftText="继续加菜" :rightText="rightText" :rightBG="rightBG" leftBG="#3a3635" @leftClick="$router.push('/')"
@rightClick="toPay" v-if="orderObj.order_status != 2"></foot-view>

props: {
  leftBG: {
    type: String
  },
  rightBG: {
    type: String
  },
  leftText: {
    type: String
  },
  rightText: {
    type: String
  }
}

 

 

 

 

转载于:https://my.oschina.net/dmq/blog/1837733