vuejs如何双向绑定传值之前处理值

 我来答
东坡下载站
2019-01-23 · 最新优质手游软件资源下载
东坡下载站
东坡下载是一个专业的无毒的免费的软件资源网站
向TA提问
展开全部

看例子

<!--html代码-->
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>财产查勘处理</title>
<link rel="stylesheet" type="text/css" href="../css/global.css" />
<link rel="stylesheet" type="text/css" href="../css/bootstrap.min.css" />
<link rel="stylesheet" type="text/css" href="../css/AdminLTE.min.css" />
<link rel="stylesheet" type="text/css" href="../css/propertySurvey.css" />
</head>
<body>
    <div class="container-fluid">
        <div style="text-align: center; height:30px;background:#F4F9FD;padding:10px 0px;border-bottom:1px solid #000; font-weight: bold;">请输入物损查看信息</div>
        <h4 class="box-title">
            <i class="glyphicon glyphicon-play-circle" style="color: #82C542;"></i>
            报案信息
        </h4>
        <hr style="height: 3px; border: none; border-top: 3px solid #75C2D2;" />
        <div class="row text-center" style="margin-top: -23px; padding: 3px 50px; border-bottom: 1px solid #DBEEF1;">
            <div style="width: 33%; float: left; text-align: left;">
                <label>损失方</label><input v-model="RegistInfo_name" type="text" name="RegistInfo_name"/>
            </div>
            <div style="width: 33%; float: left; text-align: left;">
                <label>联系人</label><input v-model="RegistInfo_user" type="text" name="RegistInfo_user"/>
            </div>
            <div style="width: 33%; float: right; text-align: left;">
                <label>联系方式</label> <input v-model="RegistInfo_phone" name="RegistInfo_phone" type="text"/>
            </div>
        </div>
        <div class="row text-center" style="margin-top: -23px; padding: 3px 50px; border-bottom: 1px solid #DBEEF1;">
            <div style="width: 33%; float: left; text-align: left;">
                <label>损失方1</label><input v-model="Prplregist_name" type="text" name="Prplregist_name"/>
            </div>
            <div style="width: 33%; float: left; text-align: left;">
                <label>联系人1</label><input v-model="Prplregist_user" type="text" name="Prplregist_user"/>
            </div>
            <div style="width: 33%; float: right; text-align: left;">
                <label>联系方式1</label> <input v-model="Prplregist_phone" name="Prplregist_phone" type="text"/>
            </div>
        </div>
        <div class="row text-center" style="padding: 3px 50px; border-bottom: 1px solid #DBEEF1;">
            <div style="width: 33%; float: left; text-align: left;">
                <label>查勘估损金额</label> <input v-model="RegistInfo_chakan_money" name="RegistInfo_chakan_money" type="text" value="400.00" /> *
            </div>
            <div style="width: 33%; float: left; text-align: left;">
                <label>施救费金额</label> <input v-model="RegistInfo_rescue_money" name="RegistInfo_rescue_money" type="text" name="" id="" value="0.00" />
            </div>
            <div style="width: 33%; float: right; text-align: left;">
                <label>需要施救</label> <input type="checkbox" />是否需要
            </div>
        </div>
        <div class="row text-center" style="padding: 3px 50px; border-bottom: 1px solid #DBEEF1;">
            <div style="width: 33%; float: left; text-align: left;">
                <label>查勘估损金额1</label> <input v-model="Prplregist_chakan_money" name="Prplregist_chakan_money" type="text" value="400.00" /> *
            </div>
            <div style="width: 33%; float: left; text-align: left;">
                <label>施救费金额1</label> <input v-model="Prplregist_rescue_money" name="Prplregist_rescue_money" type="text" name="" id="" value="0.00" />
            </div>
            <div style="width: 33%; float: right; text-align: left;">
                <label>需要施救1</label> <input type="checkbox" />是<input type="checkbox" />没错<input type="checkbox" />必须
            </div>
        </div>
        <div class="row text-center" style="padding: 3px 50px; border-bottom: 1px solid #DBEEF1;">
            <div style="width: 67%; float: left; text-align: left;">
                <label>查勘地点</label> <input v-model="address" name="address" type="text" style="width: 400px;" /> *
            </div>
            <div style="width: 33%; float: left; text-align: left;">
                <label>查勘日期</label> <input v-model="RegistInfo_chakan_data" name="RegistInfo_chakan_data" type="text" name="" id="" value="2017-03-09" />
            </div>
        </div>
        <div class="row text-center" style="padding: 3px 50px; border-bottom: 1px solid #DBEEF1;">
            <div style="height: 50px; text-align: left;">
                <label>施救过程描述</label> <input v-model="RegistInfo_say" name="RegistInfo_say" type="text" style="width: 900px; height: 50px;" />
            </div>
        </div>
        <div class="row text-center" style="padding: 3px 50px; border-bottom: 1px solid #DBEEF1;">
            <div style="height: 50px; text-align: left;">
                <label>备注</label> <input v-model="remark" name="remark" type="text" style="width: 900px; height: 50px;" />
            </div>
        </div>
        <div class="row text-center" style="padding: 3px 50px; border-bottom: 1px solid #DBEEF1;">
            <div style="height: 50px; text-align: left;">
                <select class="select2">
                    <option value="123" id="sel1">123</option>
                    <option value="456" id="sel2">456</option>
                    <option value="789" id="sel3">789</option>
                </select>
            </div>
        </div>
        <div class="row text-center" style="padding: 3px 50px; border-bottom: 1px solid #DBEEF1;">
            <div style="height: 50px; text-align: left;">
                <input type="radio" id="google" value="Google" v-model="RegistInfo_radio" name="RegistInfo_radio">
                <label for="google">Google</label>
                <br>
                <input type="radio" id="runoob" value="Runoob" v-model="RegistInfo_radio" name="RegistInfo_radio">
                <label for="runoob">Runoob</label>
            </div>
        </div>
        <div class="row text-center" style="padding: 3px 50px; border-bottom: 1px solid #DBEEF1;">
            <div style="height: 50px; text-align: left;">
                <input type="radio" id="helongjun" value="helongjun" v-model="RegistInfo_helongjun" name="RegistInfo_helongjun">
                <label for="helongjun">helongjun</label>
                <br>
                <input type="radio" id="longjun" value="longjun" v-model="RegistInfo_helongjun" name="RegistInfo_helongjun">
                <label for="longjun">longjun</label>
            </div>
        </div>
        <div class="row text-center" style="padding: 3px 50px; border-bottom: 1px solid #DBEEF1;">
            <div style="height: 50px; text-align: left;">
                <input type="radio" id="testOne" value="testOne" v-model="testOne" name="testOne">
                <label for="helongjun">testOne</label>
                <br>
                <!--<input type="radio" id="testOne" value="testTwo" v-model="testOne" name="testOne">
                <label for="longjun">testTwo</label>-->
            </div>
        </div>
        <div class="row text-center" style="padding: 3px 50px; border-bottom: 1px solid #DBEEF1;">
            <div style="height: 50px; text-align: left;">
                <select v-model="RegistInfo_selected" name="RegistInfo_selected">
                    <option value="">选择一个网站</option>
                    <option value="baidu">baidu</option>
                    <option value="google">Google</option>
                </select>
            </div>
        </div>
        <div class="text-center row">
            <button>暂存(S)</button>
            <button onclick="getInputVal()">返回(F)</button>
        </div>
    </div>
    <script type="text/javascript" src="../js/vue.min.js" ></script>
    <script type="text/javascript" src="../js/jquery-1.11.0.min.js"></script>
    <script type="text/javascript" src="../js/bootstrap.min.js"></script>
    <script type="text/javascript" src="../js/bootstrap-datetimepicker.min.js"></script>
    <script type="text/javascript" src="../VueFormSub.js" ></script>
--------------------- 
作者:藏海花无花 
来源:CSDN 
原文:https://blog.csdn.net/lovelongjun/article/details/73371846 
版权声明:本文为博主原创文章,转载请附上博文链接!
本回答被网友采纳
已赞过 已踩过<
你对这个回答的评价是?
评论 收起
推荐律师服务: 若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询

为你推荐:

下载百度知道APP,抢鲜体验
使用百度知道APP,立即抢鲜体验。你的手机镜头里或许有别人想知道的答案。
扫描二维码下载
×

类别

我们会通过消息、邮箱等方式尽快将举报结果通知您。

说明

0/200

提交
取消

辅 助

模 式