vue使用案例，vue初始化，vue初始化方法，vue条件语句，vue在js里面添加元素调用vue方法...

清疚 2021-11-01 08:50 257阅读 0赞

<div id="main" >
           <button id='but1' type="button" v-on:click="save"  v-on:mouseout="seout('but1')" v-on:mouseover="seover('but1')">
             {
         {button}}
           </button>
          </div>

let vue= new Vue({
          el:'#main',
          data: {
            text1: '乘客网约订单超时取消时间(分):',
            text2: '乘客流水班线订单超时取消时间(分):',
            input1: '',
            input2: '',
            button:'保存',
            th7:'创建时间',
            th8:'操作',
            trs:'<td colspan=\"8\">暂无数据</td>'
          },
             //用于数据初始化
          created:function(){        
      
          },
          methods: {
                 seover: function (a) {            
                    $("#"+a).css("background-color","#3399ff"); 
                     },
                 seout: function (a) {
                  $("#"+a).css("background-color","#1C86EE");   
                     },
                  save:function (){
                       if(!this.input1 || !this.input2 || !this.input3 || !this.input4 || !this.input5 || !this.input6){
                           alert("请填写必填信息!");
                           return;
                           }
                     
                      },
                      
                }
        })

vue条件语句

<tr v-if="b">
                 <td colspan="8">{
        {td8}}</td>
              </tr> 
                        
              <tr v-else>
                 <td >{
        {td1}}</td>
                 <td >{
        {td2}}</td>
                 <td >{
        {td3}}</td>
                 <td >{
        {td4}}</td>
                 <td >{
        {td5}}</td>
                 <td >{
        {td6}}</td>
                 <td  >{
        {td7}}</td>
                 <td v-html='td8' ></td>
              </tr>

vue在js里面添加元素以及调用vue方法

vue.td8='<span  οnclick=\"vue.stop();\" style=\"color: blue;cursor: pointer;\" >禁用</span>  '
                               +'<span οnclick=\"vue.del();\" style=\"color: blue;cursor: pointer;\" >删除</span>';

转载于:https://www.cnblogs.com/qq376324789/p/11214675.html

发表评论取消回复

表情：

评论列表（有 0 条评论，257人围观）

还没有评论，来说两句吧...

相关阅读

相关 Vue之初始化一个vue项目

Vue之初始化一个vue项目以防忘记需要重新查资料创建，在这里简略的记一记 1、node.js官网下载安装node.js [https://nodejs.org/

桃扇骨/ 2023年07月07日 08:20/ 0 赞/ 37 阅读

相关【vue】vue-meta使用方法

本文介绍Vue3中vue-meta的使用方法 > meta标签用于设置HTML的元数据（描述数据的数据），该数据不会显示在页面中，主要用于浏览器（如和现实内容或重新加载页面）

梦里梦外;/ 2023年06月25日 03:09/ 0 赞/ 20 阅读

相关 Vue.js 中初始化 Handsontable

这里写目录标题初始化 Handsontable 安装 Handsontable 新建 Vue 模板 Table.v

怼烎@/ 2023年02月17日 08:56/ 0 赞/ 21 阅读

相关 Vue---通过vue-cli(vue脚手架)初始化创建Vue项目

注：本机需要先安装node.js，才能使用vue-cl脚手架创建vue(Vue版本：2)项目。 1.安装vue-cli(现在最新版本：@vue/cli 4.3.1)

傷城~/ 2023年02月10日 11:29/ 0 赞/ 267 阅读

相关初始化vue项目

方法一：可视化界面创建 vue ui 之后会跳转到浏览器可视化界面，按照步骤创建项目即可 ![在这里插入图片描述][watermark_type_ZmFuZ

àì夳堔傛蜴生んèń/ 2022年11月16日 13:56/ 0 赞/ 241 阅读

相关【vue】vue3.x项目初始化

文章目录 vue项目初始化参考文档出现的问题 Delete \`␍\`eslint(prettier/pretti

太过爱你忘了你带给我的痛/ 2022年09月03日 14:16/ 0 赞/ 284 阅读

相关初始化vue项目

vue环境搭建以及vue-cli使用 Vue多页面应用文件引用 ![70][] vue官网下载在项目目录下输入: npm i vue --save,会出现mod

谁践踏了优雅/ 2022年05月14日 09:15/ 0 赞/ 275 阅读

相关 vue.js使用方法

1、现在html中添加如下： ![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6

矫情吗；*/ 2022年03月16日 09:22/ 0 赞/ 184 阅读

相关 vue使用案例，vue初始化，vue初始化方法，vue条件语句，vue在js里面添加元素调用vue方法...

<div id="main" > <button id='but1' type="button" v-on:click="sa

清疚/ 2021年11月01日 08:50/ 0 赞/ 258 阅读

相关 vue 添加初始化动画

这个蛮简单的，蛮写一下思路：在index.html文件的body中写一个id为Loading的div，然后再created生命周期的时候判断这个div是否存在，存在的话就

野性酷女/ 2021年09月04日 08:34/ 0 赞/ 343 阅读