黑马程序员技术交流社区

标题: 【郑州校区】Java的新项目学成在线笔记-day9(十) [打印本页]

作者: 谷粒姐姐    时间: 2019-4-18 16:06
标题: 【郑州校区】Java的新项目学成在线笔记-day9(十)
本帖最后由 谷粒姐姐 于 2019-4-23 14:35 编辑

2.3.3.4 页面测试
请求:http://www.xuecheng.com/course/detail/course_main_template.html测试课程详情页面模板是否可以正 常浏览。

2.3.3.5 页面动态脚本
为了方便日后的维护,我们将javascript实现的动态部分单独编写一个html 文件,在门户的include目录下定义 course_detail_dynamic.html文件,此文件通过ssi包含在课程详情页面中.

文件地址:资料\静态页面目录\include\course_detail_dynamic.html 所有的课程公用一个 页面动态脚本。
在课程详情主页面下端添加如下代码,通过SSI技术包含课程详情页面动态脚本文件:

[AppleScript] 纯文本查看 复制代码
<script>var courseId = "template"</script> <!‐‐#include virtual="/include/course_detail_dynamic.html"‐‐> </body> </html>

本页面使用vue.js动态获取信息,vue实例创建的代码如下:
主要查看 created钩子函数的内容。

[AppleScript] 纯文本查看 复制代码
var body= new Vue({   //创建一个Vue的实例    
     el: "#body", //挂载点是id="app"的地方      
     data: {         
   editLoading: false,   
          title:'测试',      
      courseId:'',      
      charge:'',//203001免费,203002收费   
         learnstatus:0,//课程状态,1:马上学习,2:立即报名、3:立即购买   
         course:{},      
      companyId:'template',   
         company_stat:[],   
         course_stat:{"s601001":"","s601002":"","s601003":""}     
    },     
    methods: {     
        //学习报名   
          addopencourse(){     
            ...         
    },      
       //立即购买   
          buy(){   
              ...      
         },      
      createOrder(){     
              ...      
      },      
      getLearnstatus(){//获取学习状态
                 ...     
        }     
      },   
    created() { //   
       this.charge = '203002'   
          this.courseId = courseId;

[AppleScript] 纯文本查看 复制代码
  //获取教育机构的统计数据    
        queryCompanyStat(this.companyId).then((res)=>{         
       console.log(res)      
         if(res.stat){         
          this.company_stat = res.stat      
              console.log(this.company_stat)      
         }      
        })     
       //获取课程的统计数据  
          queryCourseStat(this.courseId).then((res)=>{      
          console.log(res)  
              if(res.stat){            
        let stat = res.stat         
          for(var i=0;i<stat.length;i++){   
                   this.course_stat['s'+stat.id] = stat.value      
             }           
     }        
        console.log(this.course_stat)   
          })        
    },      
  mounted(){   
        // alert(courseId)     
      }   
  })









欢迎光临 黑马程序员技术交流社区 (http://bbs.itheima.com/) 黑马程序员IT技术论坛 X3.2