Crud 模块

刷新

刷新 - 图1

点击刷新按钮回调refresh-change方法返回当前分页page和搜索的表单searchForm

  1. <avue-crud :data="data" :option="option" @refresh-change="refreshChange"></avue-crud>
  2. <script>
  3. export default {
  4. data() {
  5. return {
  6. data: [
  7. {
  8. name:'张三',
  9. sex:'男'
  10. }, {
  11. name:'李四',
  12. sex:'女'
  13. }
  14. ],
  15. option:{
  16. page:false,
  17. align:'center',
  18. menuAlign:'center',
  19. column:[
  20. {
  21. label:'姓名',
  22. prop:'name'
  23. }, {
  24. label:'性别',
  25. prop:'sex'
  26. }
  27. ]
  28. },
  29. };
  30. },
  31. methods: {
  32. refreshChange({page,searchForm}){
  33. this.$message({
  34. message: `当前的返回的分页对象${JSON.stringify(page)} 搜索表单对象${JSON.stringify(searchForm)}`,
  35. type: 'success',
  36. });
  37. }
  38. }
  39. }
  40. </script>