【django+Vue】数据更新，Vue却无法实时渲染，如何解决？

Question

问题遇到的现象和发生背景

用Django+Vue框架，后台通过pandas获取mysql数据库（数据实时变化）里的最新数据，通过websocket传给前端，想实现数据实时变化的效果，但是后端数据变化，前端页面上的数据并没有实时渲染上去

问题相关代码，请勿粘贴截图

这是后端用pandas取出的数据，需要的是newtime_degree和new_degree，并且已经实现了通过websocket发送给前端页面

mysql_cn = MySQLdb.connect(host='localhost', port=3306, user='root', passwd='root', db='xiangmu')
            data_degree = pd.read_sql("select * from read_temp", con=mysql_cn)

            #获取行数
            num_degree=data_degree.shape[0]
            num_speed=data_speed.shape[0]

            #从读取的所有数据中取出相应的数据
            newtime_degree = data_degree['create_time'].astype(str)

            newshudegree = data_degree['degree']

     data2 = {
                'newtime_degree':newtime_degree.iloc[-1],
                'new_degree':newshudegree.iloc[-1]
}

这是html

{#避免跟django模板的{{ }}冲突，选择在Vue代码里设置用[[ ]]代替花括号#}
       <div class="child" id="child1">
            <p>当前温度值:[[ degree ]]℃</p>
            <p>监测时间：[[ time ]]</p>
        </div>

这是Vue相关部分

 var child1=new Vue({
                delimiters:['[[', ']]'],
                el:'#child1',
                data:{
                    degree:realdata.new_degree,
                    time:realdata.newtime_degree,
                }
            })

运行结果及报错内容

实时数据能传送过来，浏览器控制台也能接受到，但是无法实时渲染，图片上的是我实际代码里传来的所有的数，实际代码里有取出最新的数的过程，就是用pandas的iloc方法，为了方便理解我在提问里仅保留了主要代码，提问里的代码这部分有所改动

我的解答思路和尝试过的方法

我想要达到的结果

后端数据变化，前端页面上的数据能实时渲染上去

Answer 1

Vue.set() 响应式新增与修改数据,此时我们需要知道Vue.set()需要哪些参数，官方API：https://cn.vuejs.org/v2/api/#Vue-set
调用方法：Vue.set( target, key, value ) 或者 this.$set(target, key, value);