localStorage 实现关注、取消关注功能

<template>
  <div class="agenda">
  <div class="dateNav">
    <ul>
        <li v-for="(dateTime,index) in dateTimes" :class="{'dateActice':ind===index}" @click="changeBgc(index)">{{dateTime}}</li>
    </ul>
  </div>
  <div class="clearFloat"></div>
  <div class="dateAgenda">
    <ul>
        <li v-for="(Agenda,index) in Agendas">
            <div class="dateAgendaLeft">
                <h1>{{Agenda.title}}</h1>
                <p>{{Agenda.message}}</p>
            </div>
            <div class="dateAgendaRight">
        <div  @click="toAgenda(Agenda,index)" >
          <span v-if="Agenda.state==true">![](../assets/images/ic-list_yiguanzhu@2x.png)<p>已关注</p></span>
          <span v-if="Agenda.state==false">![](../assets/images/ic-list_guanzhu@2x.png)<p>关注</p></span>
        </div>
                <span>![](../assets/images/ic-luxian@2x.png)<p>去这里</p></span>
            </div>
        </li>
        <div class="clearFloat"></div>
    </ul>
  </div>
  </div>
</template>

<script>
export default {
  name: 'agenda',
  data () {
    return {
        dateTimes:["2017.8.21","2017.8.22","2017.8.23"],
        ind:"",
        dateAgendas:[],
      Agendas:[]
    }
  },
  methods:{
    changeBgc:function(index){
        this.ind=index;
    },
    toAgenda:function(Agenda,index){
      Agenda.state=!Agenda.state
      this.Agendas[index].state=Agenda.state
      var array= JSON.parse(window.localStorage.localAgenda)
      for(let i=0;i<array.length; i++){
        if(Agenda.id==array[i].id){
          array[i].state=Agenda.state
        }
      }
      window.localStorage.localAgenda=JSON.stringify(array)
      function isIn (a,arr) {
                for (let i = 0; i < arr.length; i++) {
                    if (a == arr[i].id) {
                        return i
                    }
                }
                return -1;
            }

      if(Agenda.state==true){
        console.log("3")
         var array2= JSON.parse(window.localStorage.attenteds)
         console.log("1",array2)
         if(isIn(Agenda.id,array2)==-1){
          array2.push(Agenda)
         }
         window.localStorage.attenteds=JSON.stringify(array2)
      }
      if(Agenda.state==false){
        console.log("4")
        var array2= JSON.parse(window.localStorage.attenteds)
        console.log("2",array2)
          if(isIn(Agenda.id,array2)!=-1){
            var i =isIn(Agenda.id,array2)
          array2.splice(i,1)
         }
         window.localStorage.attenteds=JSON.stringify(array2)
      }
    }
  },
  created(){
    this.ind=0;
    var AgendasObj=[
    {id:1,title:"我是标题1",message:"信息摘要信息摘要信息摘要"},
    {id:2,title:"我是标题1",message:"信息摘要信息摘要信息摘要"},
    {id:3,title:"我是标题1",message:"信息摘要信息摘要信息摘要"},
    {id:4,title:"我是标题1",message:"信息摘要信息摘要信息摘要"},
    {id:5,title:"我是标题1",message:"信息摘要信息摘要信息摘要"},
    {id:6,title:"我是标题1",message:"信息摘要信息摘要信息摘要"}
    ]
    if(!window.localStorage.attenteds){
      var attenteds=[]
       window.localStorage.attenteds=JSON.stringify(attenteds)
    }
    if(!window.localStorage.localAgenda){   
      var localAgendas=[]
      window.localStorage.localAgenda=JSON.stringify(localAgendas)
      toStorage()
    }else{
        var localAgendas=[]
      toStorage()
    }
    var newArray=JSON.parse(window.localStorage.localAgenda)
    for(let i=0; i<AgendasObj.length; i++){
      for(let j =0;j<newArray.length; j++){
        if(AgendasObj[i].id==newArray[j].id){
          AgendasObj[i].state=newArray[j].state
        }
      }
    }
    console.log("newAgendasObj",AgendasObj)
    this.Agendas=AgendasObj

        function toStorage(){
           var array= JSON.parse(window.localStorage.localAgenda)
              for(var i=0 ; i<AgendasObj.length; i++){
                localAgendas[i]={}
                localAgendas[i].id=AgendasObj[i].id
                localAgendas[i].state=false
              }
              for(let j=0;j<localAgendas.length ; j ++ ){
                if(isIn(localAgendas[j].id,array)==-1){
                  array.push(localAgendas[j])
                }
              }
              window.localStorage.localAgenda=JSON.stringify(array)

        }
            
            function isIn (a,arr) {
                for (let i = 0; i < arr.length; i++) {
                    if (a == arr[i].id) {
                        return i
                    }
                }
                return -1;
            }
  }
}
</script>
<style scoped>
</style>