随笔分类 - vue基础
摘要:<!-- <template> <Main class="cccc"/> <component-a/> <slot-demo> <template #header="slotProps"> <p>插槽标题-{{slotProps.msg}}</p> </template> <template v-s
阅读全文
摘要:<template> <h3>CompA</h3> <component-b :onfun="dateFun"></component-b> <p>{{msg}}</p> </template> <script> import ComponentB from "@/components/Compon
阅读全文
摘要:<template> <!-- <Main class="cccc"/> <component-a/> --> <slot-demo> <template #header="slotProps"> <p>插槽标题-{{slotProps.msg}}</p> </template> <template
阅读全文
摘要:<template> <h3>监听器</h3> <p>{{message}}</p> <button @click="updateHandle">点击</button> </template> <script> export default { name: "WatchDemo", data(){
阅读全文
摘要:<template> <p :style="{color:activeColor,fontSize:fontsize+'px'}"></p> </template> <script> export default { name: "StyleDemo", data(){ return{ active
阅读全文
摘要:<template> <div ref="contain">{{content}}</div> <button @click="getElemet">获取元素</button> <input type="text" ref="username"> </template> <script> expor
阅读全文
摘要:<template> <input type="text" v-model.lazy="message"> <div>{{message}}</div> <input type="checkbox" v-model="flag"> <div>{{flag}}</div> </template> <s
阅读全文
摘要:<template> <h3>事件修饰符</h3> <a @click="clickHandle" href="www.baidu.com">百度</a> <div @click="clickDiv"> <p @click="clickP">测试冒泡</p> </div> </template> <
阅读全文
摘要:<template> <p :class="{'active':isActive}">Class样式绑定</p> <p :class="Objec">Class样式绑定</p> <p :class="[arrActive,arrHasErr]">Class样式绑定3</p> <p :class="i
阅读全文
摘要:<template> <h3>数组</h3> <button @click="addnums">添加数据</button> <p v-for="(item,index) in nums" :key="index">{{item}}</p> </template> <script> export de
阅读全文
摘要:<template> <h3>模板语法</h3> <p>{{msg}}</p> <p>{{number+1}}</p> <p>{{flag? 'yes':'no'}}</p> <p>{{message.split("").reverse().join("")}}</p> <p v-html="raw
阅读全文