Day22 vue.js修改文章

延续昨日
今天来把修改文章的功能完成
修改文章跟修改帐户讯息基本上一样
所以我们就先从创一个ChangeArticles.vue 开始
然後新增一个route(参考day16)

之後直接复制 addproject.vue的全部程序码过去

复制过来之後长成这样
那我希望是可以显示出要修改的专案名称
然後可以把原本专案的内容都先打上去 只修改我想改的部分
所以我们就做一点小修改
首先是把接取文章的result改成这样

async mounted(){
         const result =await axios.get(`${this.db_api}`+"articles/"+this.$route.params.id) 
      
     this.projects=result.data
  },

This.$route.params.id就是project.id 用哪一个都可以
再来就是把原本的submit的result改一下 原本是await axios.post 改成axios.put 至於status则是和account一样是200

 async submit()
      {
         const result = await axios.put(`${this.db_api}`+"articles/"+this.$route.params.id,{
         title:this.projects.title,
          person:this.projects.person,
          status:this.projects.status,
          content:this.projects.content,
          time:this.projects.time,
          useraccount:this.projects.useraccount,
          url:this.projects.url,
          swagger:this.projects.swagger,
          api:this.projects.api,
          api_val:this.projects.api_val
          
         
        })
          console.warn(result);
        if(result.status==200){ 
              alert("成功")
          this.$router.push({name:'Home'})
        }
        
      }

在把网站的layout改一下

嘟嘟噜 这样就完成修改了

但是我发现 有些想坏坏的人可以透过route 去修改别人的文章

这次就不是和之前一样确认session就好 还要确认这篇文章是否是该seesion的帐号
所以我设定了这个funciton

async GetArticles(){
      const result =await axios.get(`${this.db_api}`+"articles/"+this.$route.params.id) 
      this.projects=result.data
      let user=sessionStorage.getItem('user-info');
       this.useraccount=JSON.parse(user).id
      if (this.useraccount!=this.projects.useraccount) {
        alert('你又想坏坏(ꐦ ಠ皿ಠ )')
        this.$router.push({name:'Project'})
      }
   
   

    },

并把他挂载在mounted

 async mounted(){
      this.GetSession()
      this.GetArticles()
      
    },

(我有偷偷修改day20没改到的getsession)
那就来解释一下程序码 result 是get 文章/文章id的各项资讯
然後把这些data丢进projects阵列
再来就是porjects.useraccount 如果不等於useraccount
则代表使用者想透过routes进入这页
p.s. Projects.useraccount是甚麽呢?

依照我们的资料库 projects.useraccount 就是sa
Projects.time就是2020/02/08 而这些资料都是在新增资料时新增的喔!
所以现在有人若想用route进入别人的文章修改的话就会被遣返回project页面

那我们就把day17的文章改成day22的文章
然後状态改成已完成吧!

以上就是今天的内容
我们明天从功能测试开始
至於什麽是功能测试呢?明天再说
我们明天见!