Load Json Daten für die erste Zeit Anfrage laden und in Home Page

Ich verwende Vue.js zum ersten Mal. Ich brauche die Objekte von djangoLoad Json Daten für die erste Zeit Anfrage laden und in Home Page

views.py

def articles(request): 
     model = News.objects.all() # getting News objects list 
     modelSerialize = serializers.serialize('json', News.objects.all()) 
     random_generator = random.randint(1,News.objects.count())  
     context = {'models':modelSerialize, 
        'title' : 'Articles' , 
        'num_of_objects' : News.objects.count() , 
        'random_order' : random.randint(1,random_generator) , 
        'random_object' : News.objects.get(id = random_generator) , 
        'first4rec' : model[0:4], 
        'next4rec' : model[4:], 
        } 
     return render(request, 'articles.html',context)

ich versucht habe, serialisiert, in html seine adaequat dort serialisierten JSON-Daten anzuzeigen

Nun, wie intialize JSON-Daten in Vue-Instanz und Zugriff in HTML mit V-Repeat-Attribut.

https://jsfiddle.net/kn9181/1yy84912/

Bitte kann jemand helfen ???

Quelle

2016-03-20 light_ray

ab Version 1.0+, v-repeat hat sich für v entfernt worden -zum. Also das könnte das Problem sein –

Thanks.I hatte sich geändert v-für jetzt, aber meine Frage im Zusammenhang mit, wie serialisierten Daten JSON zu js –

übergeben Ich weiß nicht Python, aber in php würden wir Dinge tun, wie, 'var json =" "' um json-Daten als String von PHP an js weiterzuleiten. und 'var obj = JSON.decode (json);' um js Objekt zu bekommen. –

Ein einfaches Beispiel.

views.py

def articles(request): 
    context { 
     'articles' : ['a1','a2','a3'] 
    } 
    return render(request, 'articles.html', context)

articles.html

{% verbatim %} 
<div id="app"> 
    <ul> 
    <li v-for="a in articles">{{ a }}</li> 
    </ul> 
</div> 
{% endverbatim %} 

<script> 
    new Vue({ 
     el : "#app", 
     data : function(){ 
      return { 
       articles : {{ articles | safe }} 
      } 
     } 
    }) 
</script>

Dinge zu achten:

The verbatim Tag Django, um zu verhindern, den Inhalt Rendering dieses Block-Tags da Vue die gleichen interpolierenden Symbole verwendet.
Der Filter safe verhindert, dass Django den Inhalt verlässt.
Wenn Sie ein Wörterbuch sind vorbei, halten es in JSON Drehen erste

Im Allgemeinen bevorzugen Übergabe von Daten an Vue über Ajax

Quelle

2016-03-21 18:53:51 zxzak

Load Json Daten für die erste Zeit Anfrage laden und in Home Page

Antwort

Verwandte Themen