当前位置: 首页 > 工具软件 > action-sheet > 使用案例 >

action-sheet使用

姬烨磊
2023-12-01

在使用mint-ui组件的action-sheet时遇到这样一个问题:就是name属性我是从后端传过来的,但是要获得每次点击的值。

官网提供的写法

html

<mt-actionsheet
  :actions="actions"
  :visible.sync="sheetVisible">
</mt-actionsheet>

js

<script>
export default {
  name: 'hello',
  data () {
    return {
      // action sheet 选项内容
      data: [{
        name: '拍照',
        method : this.getCamera	// 调用methods中的函数
      }, {
        name: '从相册中选择', 
        method : this.getLibrary	// 调用methods中的函数
      }],
      // action sheet 默认不显示,为false。操作sheetVisible可以控制显示与隐藏
      sheetVisible: false
    }
  },
  methods: {
    actionSheet: function(){
    	// 打开action sheet
      this.sheetVisible = true;
    },
    getCamera: function(){
      console.log("打开照相机")
    },
    getLibrary: function(){
      console.log("打开相册")
    }
  }
}
</script>

由于我的需求是通过循环给数组绑定name属性和method,代码如下:

for(let i=0;i<res.data.list.length;i++){
   this.returnReasons[i]={
         name:res.data.list[i].name,
         method:this.innerText
     }
 }

innerText(e){    //可以通过e来获取当前点击的对象的name属性
  this.refundReason=e.name;
 },
 类似资料: