哪里有门户网站开发,.net 开源 企业网站,重庆网站建设大概多少费用,淘宝店网站建设响应式#xff1a; 数据变化#xff0c;视图自动更新
接下来使用一个例子来体现一下什么是响应式
案例一#xff1a;
访问数据#xff0c;视图自动更新
!DOCTYPE html
html langen
headmeta charsetUTF-8…响应式 数据变化视图自动更新
接下来使用一个例子来体现一下什么是响应式
案例一
访问数据视图自动更新
!DOCTYPE html
html langen
headmeta charsetUTF-8titleTitle/title
/head
body!--准备容器 --
div idapp/div!-- 引包 --
script srchttps://cdn.jsdelivr.net/npm/vue2.7.14/dist/vue.js/script!-- 创建实例 --
scriptvar appnew Vue({el:#app,data:{str1:hello,str2:你好}});
/script
/body
/html
ctrl shift j 打开控制台模拟一下响应式变化 访问谁就会产生相应的变化
案例二
修改数据视图自动更新
!DOCTYPE html
html langen
headmeta charsetUTF-8titleTitle/title
/head
body!--准备容器 --
div idapp
{{msg}}/div!-- 引包 --
script srchttps://cdn.jsdelivr.net/npm/vue2.7.14/dist/vue.js/script!-- 创建实例 --
scriptvar appnew Vue({el:#app,data:{msg:你好}});
/script
/body
/html
修改前 通过控制台改变数据可以看到视图随着数据的变化而自动更新
