vue.js过滤器+ajax实现事件监听及后台php数据交互实例

vue.js过滤器+ajax实现事件监听及后台php数据交互实例

更新时间：2018年05月22日 08:48:59 作者：爱代码也爱生活

这篇文章主要介绍了vue.js过滤器+ajax实现事件监听及后台php数据交互,结合实例形式分析了vue.js前台过滤器与ajax后台数据交互相关操作技巧,需要的朋友可以参考下

本文实例讲述了vue.js过滤器+ajax实现事件监听及后台php数据交互。分享给大家供大家参考PHP过滤器，具体如下：

在vue.js开发时，数据可以使用jquery和vue-resource来获取数据。在获取数据时，一定需要给一个数据初始值。

index.html：

 
 
 


 

  ajax获取数据
  

   

    
id
    
姓名
    
手机号
    
城市
    
性别
    
通过审核
    
我的学生
    
操作
   
   

    
{{item.id}}
    
{{item.name}}
    
{{item.tel}}
     
{{item.sex | sexFormat}}
    
{{item.province}}_{{item.city}}
    
是
    
否
    

     
     {{stu.name}},
     
    
    

     修改
     删除
    
   
  
 

json.php：

<?php
header("Content-type:text/html;charset=utf-8");
for($i=1;$i<6;$i++){
 $data[]=array(
  'id'=>$i,
  'name'=>'test'.$i,
  'tel'=>'1368585789'.$i,
  'status'=>1,
  'province'=>'上海市',
  'city'=>'上海市',
  'sex'=>1,
  'stu'=>array(array('id'=>$i,'name'=>'stu'.$i,'tel'=>'1568585789')),
 );
}
echo json_encode($data);exit;

运行结果：

希望本文所述对大家vue.js程序设计有所帮助。

（编辑：广州站长网）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!